我正在学习 3d-highchars ,动态添加系列时遇到一些小问题。
该系列未加载到正确的位置,即第二个“stack:1”正在加载“stack:0”位置。
我添加了以下代码片段检查并让我知道这个问题。 【点击“点我”按钮生成图表】
提前致谢!!
var chart;
$(function () {
// Set up the chart
chart = new Highcharts.Chart({
chart: {
renderTo: 'container', type: 'column',
options3d: { enabled: true, alpha: 25, beta: 25, viewDistance: 25, depth: 40 },
marginTop: 80, marginRight: 40
},
plotOptions: { column: { depth: 40, stacking: true, grouping: false } },
series: []
});
$('#clickMe').on('click', function () {
var odata=[{data: [1,5,3,6,2],stack: 0},
{data: [7,7,9,8,6],stack: 1}];
$.each(odata, function (itemNo, item) {
chart.addSeries({
data: item.data,
stack: item.stack
}, false);
});
chart.redraw();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-3d.js"></script>
<button id="clickMe">Click Me</button>
<div id="container"></div>
最佳答案
请记住按照documentation
您至少需要以下深度:列数 *(列深度 + z 填充)
。所以这是更新的fiddle通过增加深度
来解决您的问题,您可以根据您的 onClick 函数对其进行修改!
chart: {
type: 'column',
margin: 75,
options3d: {
enabled: true,
alpha: 25,
beta: 25,
viewDistance: 25,
depth: 110
}
},
plotOptions: {
column: {
depth: 40,
stacking: true,
grouping: false,
groupZPadding: 10
}
}
关于javascript - 3D-Highchart 动态系列 添加问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30980730/