0
我想將我的圖表打入另一個容器。我在圖表中有3到4個向下鑽取級別，我希望他們都能在不同的容器中顯示。 我怎樣才能做到這一點最簡單的方式，而不在我的代碼進行復制，並沒有使它complex.` HighChart追溯例 如何使用renderTo或重繪方法將餅圖highchart展開到多個容器中？
</head>
<body>
<div id="container0" style="min-width: 900px; height: 500px; margin: 0 "></div>
<div id="container1" style="min-width: 900px; height: 300px; margin: 0 "></div>
<div id="container2" style="min-width: 900px; height: 100px; margin: 0 "></div>
<script>
var chartType;
function getTitle()
{
var e = document.getElementById("getTitleId");
chartType = e.options[e.selectedIndex].value;
return chartType;
}
var defaultTitle = "Sales Summary [Quarterly]";
var drilldownTitle = " Sales";
var chart = Highcharts.chart({
chart: {
renderTo: 'container0',
type: 'pie',
marginLeft:120,
options3d: {
enabled: true,
alpha: 45,
beta: 0
},
events: {
drilldown: function(e) {
chart.setTitle({ text: e.point.name + drilldownTitle });
},
drillup: function(e) {
chart.setTitle({ text: defaultTitle });
}
}
},
title: {
text:defaultTitle
},
credits : {
enabled : false
},
events:{
drilldown: function(e)
{
chart.setTitle({text: e.point.name}, {text: ''});
},
drillup: function(e){
if(e.seriesOptions.name == topLevelSeriesName) {
chart.setTitle({text: topLevelTitle}, {text: topLevelSubtitle});
}
else {
chart.setTitle({text: e.seriesOptions.name}, {text: ''});
}
}
},
xAxis: {
type: 'category'
},
tooltip: {
pointFormat: `{point.tooltips}<br>Sales:{point.y}</b>`
},
plotOptions: {
showInLegend: true,
pie: {allowPointSelect: true,
depth: 35,},
series: {
borderWidth: 50,
dataLabels: {
enabled: true,
}
}
},
series: [{
type:'pie',
name: 'Quarterly',
colorByPoint: true,
data: [
{
name: 'QUARTER 1',
y:3061997,
drilldown: 'quarter1'
},
{
name: 'QUARTER 2',
y:56608868,
drilldown: 'quarter2'
}
]
}],
drilldown: {
drillUpButton: {
relativeTo: 'spacingBox',
position: {
y: 0,
x: 0
},},
series: [
{
id: 'quarter1',
name: 'MONTHLY',
data: [
{
name:'FEBRUARY',
y:139353,
drilldown: 'february'
},
{
name:'MARCH',
y:2922643,
drilldown: 'march'
}
]
},
{
type:'pie',
id: 'quarter2',
name: 'MONTHLY',
data: [
{
name: 'APRIL',
y:21781659,
drilldown: 'april'
},
{
name:'MAY',
y:19387600,
drilldown: 'may'
},
{
name:'JUNE',
y:15439608,
drilldown: 'june'
}
]
}
]
}
});
</script>
</body>
` 哪有我在向下鑽取每次點擊事件時將此圖表鑽入不同的容器中？
這裏的鏈接到jsfiddle
你的意思是通過鑽取到不同的容器？點擊源自的容器會發生什麼？您是否試圖在一個圖表上應用篩選器以適用於其他圖表？ – ewolden
原始包容器沒有任何反應。 它只是用於在新容器中加載的向下鑽取的源代碼。 – Lalit