0
У меня есть highchart с типом диаграммы, как сплайнПоказать только некоторые серии в Highcharts сплайн картировать
В этом графике, у меня есть около 36 рядов данных, но проблема в том, что показ 36 серий в одном графике очень сложно для понимания и, более того, почти у всех почти одинаковые данные.
Мой вопрос в том, как мы можем отображать только выбранные или предварительно определенные ряды, а не показывать все серии одновременно, что по умолчанию выполняется по высоким диалогам.
Кроме того, я не хочу менять свой 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). Также не составит труда добавить флаги 'visible' в ваши данные JSON после их извлечения, но прежде чем вставлять их в Highcharts – Phil