我设置这个小提琴来说明我的问题:http://jsfiddle.net/3nDvK/5/
基本上具有相同数据的双系列... y轴刻度和绘图是不同的。
如果series1上的数据与series2上的数据相同......我不知道为什么两个系列在图形上都不同。帮助!
小提琴的代码就是这个
Highcharts.setOptions({
lang: {
contextButtonTitle: 'Menu do gráfico',
months: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'],
weekdays: ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado'],
shortMonths: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
downloadPNG: 'Download em imagem PNG',
downloadJPEG: 'Download em imagem JPG',
downloadPDF: 'Download em documento PDF',
downloadSVG: 'Download em imagem vector SVG',
exportButtonTitle: 'Exportar o gráfico',
loading: 'Carregamento em curso...',
printChart: 'Imprimir o gráfico'
}
});
$(function() {
data = [[1398604500000,17.3,17.3],[1398605400000,17.9,17.9],[1398606300000,17.8,17.8],[1398607200000,18,18],[1398608100000,17.9,17.9],[1398609000000,18,18],[1398609900000,17.6,17.6],[1398610800000,17.3,17.3],[1398611700000,17.5,17.5],[1398612600000,17.7,17.7],[1398613500000,17.5,17.5],[1398614400000,17.7,17.7],[1398615300000,18,18],[1398616200000,18,18],[1398617100000,17.6,17.6],[1398618000000,17.1,17.1],[1398618900000,17.2,17.2],[1398619800000,16.9,16.9],[1398620700000,16.4,16.4],[1398621600000,16.2,16.2],[1398622500000,16.5,16.5],[1398623400000,15.9,15.9],[1398624300000,14.7,14.7],[1398625200000,13.9,13.9],[1398626100000,13.4,13.4],[1398627000000,13,13],[1398627900000,12.9,12.9],[1398628800000,12.6,12.6],[1398629700000,12.4,12.4],[1398630600000,12.3,12.3],[1398631500000,11.9,11.9],[1398632400000,11.6,11.6],[1398633300000,11,11],[1398634200000,10.4,10.4],[1398635100000,10,10],[1398636000000,10.1,10.1],[1398636900000,9.9,9.9],[1398637800000,9.3,9.3],[1398638700000,8.9,8.9],[1398639600000,8.5,8.5],[1398640500000,8.3,8.3],[1398641400000,7.8,7.8],[1398642300000,7.4,7.4],[1398643200000,7.6,7.6],[1398644100000,7.2,7.2],[1398645000000,6.9,6.9],[1398645900000,7.1,7.1],[1398646800000,6.9,6.9],[1398647700000,6.8,6.8],[1398648600000,6.3,6.3],[1398649500000,6.3,6.3],[1398650400000,6.3,6.3],[1398651300000,6.9,6.9],[1398652200000,6.8,6.8],[1398653100000,6.8,6.8],[1398654000000,7,7],[1398654900000,7.2,7.2],[1398655800000,7.3,7.3],[1398656700000,7.6,7.6],[1398657600000,7.9,7.9],[1398658500000,8.1,8.1],[1398659400000,8.2,8.2],[1398660300000,8.2,8.2],[1398661200000,8.5,8.5],[1398662100000,8.6,8.6],[1398663000000,8.8,8.8],[1398663900000,9.2,9.2],[1398664800000,9.3,9.3],[1398665700000,9.6,9.6],[1398666600000,10,10],[1398667500000,10.2,10.2],[1398668400000,10.9,10.9],[1398669300000,10.9,10.9],[1398670200000,10.8,10.8],[1398671100000,11.3,11.3],[1398672000000,12.2,12.2],[1398672900000,12.7,12.7],[1398673800000,14.1,14.1],[1398674700000,13.6,13.6],[1398675600000,13.6,13.6],[1398676500000,13,13],[1398677400000,13.9,13.9],[1398678300000,14.9,14.9],[1398679200000,14.8,14.8],[1398680100000,15,15],[1398681000000,15.3,15.3],[1398681900000,15.2,15.2],[1398682800000,15.6,15.6],[1398683700000,16.7,16.7],[1398684600000,16.5,16.5],[1398685500000,16.3,16.3],[1398686400000,16.2,16.2],[1398687300000,16.6,16.6],[1398688200000,17.5,17.5],[1398689100000,17.7,17.7]];
val1 = [];
val2 = [];
$.each(data, function (key, value) {
val1.push([value[0], value[1]]);
val2.push([value[0], value[2]]);
});
$('#container2111').highcharts('StockChart', {
chart: {
zoomType: 'xy'
},
rangeSelector : {
selected : 0,
inputEnabled: $('#container').width() > 480,
buttons: [{
type: 'week',
count: 1,
text: '1s'
}, {
type: 'week',
count: 2,
text: '2s'
}, {
type: 'month',
count: 1,
text: '1m'
}, {
type: 'month',
count: 2,
text: '2m'
}, {
type: 'all',
text: 'Tudo'
}]
},
title : {
text : ''
},
subtitle : {
text : '2014-04-27 14:37:01 TO 2014-04-28 14:37:01',
},
credits : {
enabled: false
},
navigator : {
adaptToUpdatedData: true,
maskFill: 'rgba(243, 156, 18, 0.35)',
series: {
type: 'areaspline',
color: 'rgba(255, 255, 255, 0.00)',
fillOpacity: 0.35,
dataGrouping: {
smoothed: false
},
lineWidth: 1,
lineColor: '#F39C12',
marker: {
enabled: false
},
shadow: true
}
},
xAxis : {
dateTimeLabelFormats : {
second: '%H:%M:%S',
minute: '%H:%M',
hour: '%H:%M',
day: '%e %b',
week: '%e %b',
month: '%b \'%y'
}
},
yAxis: [{
labels: {
format: '{value} ºC',
style: {
color: '#F39C12'
}
},
title: {
text: 'Teste1',
style: {
color: '#F39C12'
}
},
opposite: false
}, {
labels: {
format: '{value} ºC',
style: {
color: '#009900'
}
},
title: {
text: 'Teste2',
style: {
color: '#009900'
}
},
opposite:true
}],
tooltip: {
shared: true
},
legend: {
enabled: true,
layout: 'vertical',
align: 'left',
x: 130,
verticalAlign: 'top',
y: 115,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
},
series : [{
name : 'Teste1',
data : val1,
color: '#F39C12',
yAxis: 1,
tooltip: {
valueDecimals: 2,
valueSuffix: ' ºC',
xDateFormat: '%A, %e/%b, %H:%M:%S'
}
},
{
name : 'Teste2',
data : val2,
color: '#009900',
type: 'column', tooltip: {
valueDecimals: 2,
valueSuffix: ' ºC',
xDateFormat: '%A, %e/%b, %H:%M:%S'
}
}]
});
});
答案 0 :(得分:1)
该系列是不同类型的。 Series 1
类型的column
,并针对yaxis: 0
绘制。从0开始,柱形图更有意义。Series 0
是一种线型,从0开始并不具有视觉上的重要性。