我有圖表類型作爲花鍵只顯示一些系列在HighCharts花鍵圖表
一個highchart在此圖表中,我有大約36個系列的數據,但問題是,示出了在一個單一的圖表36系列是非常困難瞭解並且幾乎所有人都有幾乎相似的數據。
我的問題是,我們怎麼能只顯示選定的或預先定義的系列,而不是顯示所有系列的一次,這是由highcharts默認情況下完成的。
而且,我不想改變我的API,它是獲取JSON數據,有沒有辦法從前端自己做呢?
$(function(){
$('#highchart_1').highcharts({
\t \t \t chart:{
\t \t \t \t type:'spline',
\t \t \t \t zoomType: 'x'
\t \t \t },
\t \t \t title: {
\t \t \t \t text: 'Pregnant Women Overview',
x: -20 //center
},
subtitle: {
\t text: 'Source:something.com',
\t x: -20
},
xAxis: {
\t categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
\t title: {
\t \t text: 'Pregnant Women (No.)'
\t },
\t plotLines: [{
\t \t value: 0,
\t \t width: 1,
\t \t color: '#808080'
\t }]
},
tooltip: {
\t valueSuffix: ''
},
legend: {
\t layout: 'vertical',
\t align: 'right',
\t verticalAlign: 'middle',
\t borderWidth: 0
},
series:[
{
name: 1000,
data: [7,4,1,0,0,1,3,6,2,2,8,7]
},
{
name: 1001,
data: [6,10,1,1,0,0,0,2,3,2,2,5]
},
{
name: 1002,
data: [
0,
0,
35,
0,
1,
0,
0,
0,
0,
0,
0,
0
]
},
{
name: 1003,
data: [
2,
1,
4,
0,
0,
1,
1,
1,
0,
4,
4,
6
]
},
{
name: 1005,
data: [
0,
0,
0,
15,
0,
0,
0,
0,
0,
0,
0,
0
]
},
{
name: 1006,
data: [
8,
8,
3,
2,
1,
0,
2,
2,
1,
2,
1,
5
]
},
{
name: 1007,
data: [
8,
9,
0,
1,
0,
1,
2,
1,
2,
7,
1,
2
]
},
{
name: 1008,
data: [
3,
4,
4,
0,
0,
1,
3,
0,
2,
4,
3,
6
]
},
{
name: 1009,
data: [
6,
6,
6,
0,
0,
0,
0,
1,
2,
0,
10,
8
]
},
{
name: 1011,
data: [
0,
0,
4,
0,
0,
0,
0,
0,
0,
0,
0,
0
]
},
{
name: 1012,
data: [
5,
7,
11,
3,
0,
0,
0,
0,
2,
1,
5,
7
]
},
{
name: 1013,
data: [
4,
4,
1,
0,
0,
0,
0,
0,
3,
3,
4,
6
]
},
{
name: 1015,
data: [
2,
6,
53,
0,
0,
0,
0,
0,
0,
1,
2,
0
]
},
{
name: 1016,
data: [
12,
8,
0,
1,
0,
0,
1,
2,
5,
1,
6,
7
]
},
{
name: 1017,
data: [
0,
1,
25,
0,
2,
0,
0,
0,
0,
0,
0,
0
]
},
{
name: 1019,
data: [
7,
9,
6,
7,
0,
0,
0,
1,
2,
1,
5,
11
]
},
{
name: 1020,
data: [
0,
2,
0,
9,
2,
0,
0,
0,
0,
0,
2,
0
]
},
{
name: 1021,
data: [
0,
4,
1,
2,
0,
0,
1,
0,
0,
3,
2,
2
]
},
{
name: 1022,
data: [
0,
0,
1,
0,
20,
0,
0,
0,
0,
0,
0,
0
]
},
{
name: 1025,
data: [
5,
2,
9,
0,
1,
2,
6,
1,
4,
1,
6,
4
]
},
{
name: 1026,
data: [
1,
0,
1,
12,
0,
1,
0,
2,
0,
1,
0,
0
]
},
{
name: 1027,
data: [
0,
2,
18,
2,
0,
0,
0,
0,
0,
0,
1,
0
]
},
{
name: 1028,
data: [
0,
1,
0,
1,
0,
0,
0,
3,
0,
1,
0,
0
]
},
{
name: 1029,
data: [
0,
0,
17,
0,
0,
0,
0,
0,
0,
0,
0,
0
]
},
{
name: 1030,
data: [
1,
1,
5,
0,
2,
0,
2,
1,
0,
1,
0,
2
]
},
{
name: 1031,
data: [
5,
4,
1,
2,
0,
1,
2,
0,
6,
2,
5,
2
]
},
{
name: 1032,
data: [
4,
7,
4,
0,
0,
2,
1,
2,
2,
0,
3,
1
]
},
{
name: 1033,
data: [
5,
2,
19,
1,
1,
0,
0,
1,
3,
1,
6,
4
]
},
{
name: 1034,
data: [
8,
2,
8,
1,
0,
2,
1,
0,
3,
0,
5,
6
]
},
{
name: 1035,
data: [
11,
6,
3,
0,
0,
0,
1,
3,
3,
3,
2,
13
]
},
{
name: 1036,
data: [
0,
3,
7,
0,
0,
0,
1,
1,
0,
4,
0,
3
]
},
{
name: 1039,
data: [
4,
1,
2,
0,
1,
0,
1,
2,
1,
1,
0,
3
]
},
{
name: 5000,
data: [
1,
1,
0,
2,
4,
0,
0,
0,
0,
0,
1,
1
]
},
{
name: 6000,
data: [
0,
0,
1,
4,
1,
0,
0,
0,
0,
0,
0,
0
]
}
]
});
}); \t
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<body>
<div id="highchart_1"></div>
</body>
您可以設置'visible:false'來初始隱藏某些系列。見http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/plotoptions/series-visible/ – Phil
沒有返工的API什麼辦法? –
當然,請使用['Series.hide()'](http://api.highcharts.com/highcharts#Series.hide)。它也不會是難以獲取之後,但它注入Highcharts – Phil