我使用 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,
您将看到图表的原始宽度。
如何在每种情况下使我的图表居中?谢谢