首页 > 解决方案 > 折线图和树状图的Highcharts组合

问题描述

我需要将可拖动的折线图和树形图结合起来。

请参见此处:JSFiddle 示例

Highcharts.chart('container', {
    series: [{
        type: "treemap",
        data: [
        {id: "NS",name: 'NS_area', value:5},
        // ...
        }
    },{
        data: [[0, 100], [10,90.9], [20,81.8], [30,72.7]],
        type: 'line',
    }]
});

使用树形图时可以显示 x,y 轴吗?你有其他想法如何组合这两个图表吗?

标签: highchartscombinationstreemap

解决方案


一种可能对您有用的解决方法是添加一个附加轴并将其简单地链接到原始轴。

例如,创建一个“重复”的 x 轴和 y 轴:

xAxis: [{
},{ 
    linkedTo: 0 
}],
yAxis: [{

}, { 
    linkedTo: 0 
}]

请参阅使用中的此 JSFiddle 演示。这使轴模仿您最初的外观。

如果您希望折线图完全独立于原始轴,您可以执行以下操作:

series: [{
    // ...
}, {
    data: [[0, 100], [10,90.9], [20,81.8], [30,72.7]],
    type: 'line',
    yAxis: 1,
    xAxis: 1,
    // ...
}],
xAxis: [{
},{ 
}],
yAxis: [{
}, { 
}],

请参阅使用中的此 JSFiddle 演示。这作为一个完全独立的轴工作。


推荐阅读