【发布时间】：2015-05-27 04:38:42
【问题描述】：
我有一个图表类型为样条的高图
在这个图表中，我有大约 36 个系列的数据，但问题是在一个图表中显示 36 个系列真的很难理解，而且几乎都有几乎相似的数据。
我的问题是，我们如何才能只显示选定或预定义的系列，而不是一次显示所有系列，这是 highcharts 默认完成的。
另外，我不想更改获取 JSON 数据的 API，有什么方法可以从前端本身进行吗？
$(function(){
$('#highchart_1').highcharts({
chart:{
type:'spline',
zoomType: 'x'
},
title: {
text: 'Pregnant Women Overview',
x: -20 //center
},
subtitle: {
text: 'Source:something.com',
x: -20
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
title: {
text: 'Pregnant Women ( No. )'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: ''
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
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
]
}
]
});
}); <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初始隐藏某些系列。见jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/… -
有什么方法可以不修改 API 吗？
-
当然，使用
Series.hide()。在获取 JSON 数据之后但在将其注入 Highcharts 之前，将visible标志添加到您的 JSON 数据中也不难
标签： javascript charts highcharts