Google 组织结构图数据溢出到 div 之外

我在一个项目中使用 Google Org 图表，图表的内容在包含的 div 之外流动。该 div 在下面以红色突出显示。我希望图表的节点能够移动到下一行，以防它流到 div 之外。 （爱丽丝将移动到下一行，数据将继续。）

See my 在这里摆弄 http://jsfiddle.net/w8Ytq/40/

我得到的结果是：

目前标准的组织结构图数据但没有连接。

function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('string', 'Manager');
    data.addColumn('string', 'ToolTip');
    data.addRows([
          [{v:'Mike', f:'Mike'}, '', 'The President'],
          [{v:'Jim', f:'Jim'}, '', 'VP'],
          ['Alice', '', ''],
          ['Bob', '', 'Bob Sponge'],
          ['Carol', '', '']
        ]);

    var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
    var options = {
        allowHtml: true
    };


    chart.draw(data, options);
}

我最终确实让它工作了，但没有直接使用 OrgChart 调用。我通过使用 div 并赋予该 div 类来手动创建每张卡

google-visualization-orgchart-node  google-visualization-orgchart-node-small

并将每个 div 设置为

display: inline-block

请参阅下面的最终代码

google.load('visualization', '1', {packages: ['orgchart']});
google.setOnLoadCallback(drawChart);

function drawChart() {
    var s = '<div class="google-visualization-orgchart-node  google-visualization-orgchart-node-small" style=\"display: inline-block; padding: 3px; margin: 5px;\">Mike</div><div class="google-visualization-orgchart-node  google-visualization-orgchart-node-small" style=\"display: inline-block; padding: 3px; margin: 5px;\">Jim</div><div class="google-visualization-orgchart-node  google-visualization-orgchart-node-small" style=\"display: inline-block; padding: 3px; margin: 5px;\">Alice</div><div class="google-visualization-orgchart-node  google-visualization-orgchart-node-small" style=\"display: inline-block; padding: 3px; margin: 5px;\">Bob</div><div class="google-visualization-orgchart-node  google-visualization-orgchart-node-small" style=\"display: inline-block; padding: 3px; margin: 5px;\">Carol</div';

    document.getElementById('chart_div').innerHTML = s;
}

我失去了 OrgChart 的一些功能，但实现了项目所需的外观。请注意，OrgChart 代码仍然需要下载（我需要它用于项目的其他方面，因此它已经可用。）

成品见小提琴http://jsfiddle.net/4eD4u/1/ http://jsfiddle.net/4eD4u/1/