HighCharts-如何动态设置边距？

debugcn 发表于 Dev

共享

我想将highcharts图表放入我的引导网格中，以便与其他内容很好地匹配。

整体应如下所示：


Col-1	第10列	Col-1
X轴标签	图表绘图区	2.轴标签
Col-1	第10列	Col-1

我认为marginLeft和marginRight应该是正确的选项，但是它们仅接受数字值，因此我无法告诉他们引导百分比值。

我的配置如下所示：

Highcharts.chart('container', {
chart: {
type: "column",
marginLeft: 65 // <= Dynamically or percent?
},

yAxis: {
    title: {
        text: null
    }
},

series: [{ }]
}

JSFiddle

有任何想法吗？

谢谢！

pot

您可以根据某个百分比值动态计算和设置边距，例如：

    chart: {
        ...,
        events: {
            render: function() {
                if (allowChartUpdate) {
                    var dynamicMargin = this.chartWidth * 8.333333 / 100;
                    allowChartUpdate = false;

                    this.update({
                        chart: {
                            marginLeft: dynamicMargin,
                            marginRight: dynamicMargin
                        }
                    }, true, true, false);

                    allowChartUpdate = true;
                }
            }
        }
    }

现场演示： https : //jsfiddle.net/BlackLabel/913scgxa/

API参考： https ：//api.highcharts.com/highcharts/chart.events.render

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。