[英]Hide/Show multiple series in HighCharts
I am using HighCharts. 我正在使用HighCharts。 I have data that is rendered in a pie chart.
我有饼图中呈现的数据。 When I click on the legend-label, I can hide/show my different pie slices.
单击图例标签时,可以隐藏/显示不同的饼图。 Woo!
呜!
What I would like to do, is hide/show different columns to the same effect in this view. 我想做的是在此视图中隐藏/显示不同的列以达到相同的效果。 (Clicking on dog/bird should remove the column - the same as the pie slice).
(单击“狗/鸟”应删除该列-与饼图相同)。
My series is: 我的系列是:
series: [{
type: "pie", //Change to "column"
data:[{
name: "dog",
age: 52,
y: 52
},
{
name: "bird",
age: 12,
y: 12
}]
}]
http://jsfiddle.net/Lmbw75mg/ http://jsfiddle.net/Lmbw75mg/
How can I change my structure so that it will work for both? 如何更改我的结构,使其对两者都适用?
For making it the same in a column chart you'll have to use two series, not one: 为了使它在柱形图中相同,您必须使用两个系列,而不是一个:
series: [{
type: "column",
name: "dog",
data: [{
age: 52,
x: 0,
y: 52
}]
}, {
type: "column",
name: "bird",
data: [{
age: 12,
x: 1,
y: 12
}]
}]
Also you'll have to define categories
for xAxis: 另外,您还必须为xAxis定义
categories
:
xAxis: {
type: 'category',
tickWidth: 0,
lineColor: "#C0D0E0",
lineWidth: 1,
categories: ['dog', 'bird']
}
And for making the columns equally spaced, you'll need to set plotOptions.column.grouping
to false: 为了使各列等距,您需要将
plotOptions.column.grouping
设置为false:
plotOptions: {
colorByPoint: true,
column: {
grouping: false
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.