Google 图表 - 组织结构图 - 高级层次结构放置

问题描述 投票：0回答：1

是否可以对 Google Charts 上的组织结构图的层次结构进行更多控制？

图示：

在网站 developers.google.com 上查看以下示例：

Alice 是否可以垂直放置到 Bob 的一侧（水平），如下所示：

这是示例代码

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {packages:["orgchart"]});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Name');
        data.addColumn('string', 'Manager');
        data.addColumn('string', 'ToolTip');

        // For each orgchart box, provide the name, manager, and tooltip to show.
        data.addRows([
          [{'v':'Mike', 'f':'Mike<div style="color:red; font-style:italic">President</div>'},
           '', 'The President'],
          [{'v':'Jim', 'f':'Jim<div style="color:red; font-style:italic">Vice President</div>'},
           'Mike', 'VP'],
          ['Alice', 'Mike', ''],
          ['Bob', 'Jim', 'Bob Sponge'],
          ['Carol', 'Bob', '']
        ]);

        // Create the chart.
        var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
        // Draw the chart, setting the allowHtml option to true for the tooltips.
        chart.draw(data, {'allowHtml':true});
      }
   </script>
    </head>
  <body>
    <div id="chart_div"></div>
  </body>
</html>
javascript google-visualization
1个回答
0
投票

Google Charts 的组织结构图似乎没有提供 API 来手动控制层次结构中各个节点的确切位置。布局和放置是根据定义的关系自动处理的。

您可以控制每个节点内的样式和内容，但是将 Alice 垂直向下放置到 Bob 一侧同时作为 Mike 的直接报告的具体要求无法使用标准 OrgChart 选项直接实现。如果这种对布局的控制至关重要，您可能需要寻找提供更大灵活性的第三方库或考虑实施自定义解决方案。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.