0

我使用 highcharts 在同一框架(固定宽度和高度)但使用不同数据(取决于用户之前的操作来选择他想要显示的组织)中动态绘制组织图(水平或垂直)。我需要每个组织级别都获得相同的高度,并且我还需要能够设置节点的宽度以始终获得相同的全局渲染。滚动条将添加到 iframe 中,以便能够查看所有图表。我使用以下代码来实现:

events: {
      load() {
        let chart = this,
        series = chart.series[0],
        newHeight = (series.options.nodeWidth+series.options.nodePadding) * (series.nodeColumns.length+1);
    
        let tab_length = [];
        for(var i=0; i < series.nodeColumns.length; i++){
              tab_length.push(series.nodeColumns[i].length);
        }
        let max_col = Math.max(...tab_length), newWidth;
        
    if(series.options.width)
    newWidth = (series.options.width+series.options.nodePadding) * max_col+series.options.nodePadding;
        
      chart.update({
        chart: {
          width: newWidth,
          height: newHeight
        }
      })
      }

它运作良好。完整组织结构图的结果在这里:https ://jsfiddle.net/vegaelce/cw2aLroz需要它在框架中居中。我的框架 i 中的小型组织结构图示例: https://jsfiddle.net/vegaelce/vr28ja67 或此处:https : //jsfiddle.net/vegaelce/s9q3yb70/

注意:如果您评论

width: 200,

您将看到图表的原始宽度。

如何在每种情况下使我的图表居中?谢谢

4

0 回答 0