高海拔的太阳爆发



我有两个不同时间段的太阳爆发图,数据结构完全相同。我想在第二个图上进行深入查看,以模仿用户在第一个图上的深入查看。我无法让它工作,请参阅下面的代码。

var data = [
{ id: 'START', name: 'START'},
{ id: 'One', name: 'One', parent: 'START' },
{ id: 'OneOne', name: 'OneOne', parent: 'One', value: 30 },
{ id: 'OneTwo', name: 'OneTwo', parent: 'One', value: 70 }
];
var chart1;
var chart2;
$(document).ready(function () {
chart2=Highcharts.chart('container2', {
series: [{
type: "sunburst", data: data, allowTraversingTree: true
}]
});

chart1=Highcharts.chart('container1', {
series: [{
type: "sunburst", data: data, allowTraversingTree: true,
point: {
events: {
click: function () {
chart2.series[0].data[1].doDrilldown();
chart2.redraw();
}
}
}
}]
});
})
<script src='https://code.jquery.com/jquery-3.3.1.js'></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/sunburst.js"></script>
<script src="https://code.highcharts.com/modules/drilldown.js"></script>
<div id="container1"></div>
<div id="container2"></div>

谢谢Chris

尝试使用setRootNode功能,并将应在第二次阳光爆发时单击的点id作为参数来实现它:

演示:https://jsfiddle.net/BlackLabel/xc34k95n/

最新更新