Highcharts多y轴单元不显示
我是海图新手。我正在从Java服务器端JSON列表中创建多个系列,JSON对象由多个系列组成,每个系列都有“电子IRM”,后面是两个Y轴标签的“温度”映射 我遇到的问题是第二个Y轴单元未显示。 JSON列表格式为Highcharts多y轴单元不显示,highcharts,axis,Highcharts,Axis,我是海图新手。我正在从Java服务器端JSON列表中创建多个系列,JSON对象由多个系列组成,每个系列都有“电子IRM”,后面是两个Y轴标签的“温度”映射 我遇到的问题是第二个Y轴单元未显示。 JSON列表格式为 {name, "serialNumber1_type1", {"data", [[timestamp1, value1], [[timestamp2, value2], ... {name, "serial
{name, "serialNumber1_type1", {"data", [[timestamp1, value1],
[[timestamp2, value2], ...
{name, "serialNumber1_type2", {"data", [[timestamp1, value1],
[[timestamp2, value2], ...
{name, "serialNumber2_type1", {"data", [[timestamp1, value1],
[[timestamp2, value2],
{name, "serialNumber2_type2", {"data", [[timestamp1, value1],
...
{"title","HighCharts Title"}
e、 g我的JSON列表
[{"name":"5004672_IRms"},{"data":[[1373958000000,53],[1373958300000,53]....
{"name","5004672_Temperature"},{"data":[[1373958000000,80],[1373958300000,81]....
{"name":"5004687_IRms"},{"data":[[1373958000000,54],[1373958300000,53]..
{"name","5004687_Temperature"},{"data":[[1373958000000,82],[1373958300000,83]...
....
{"title", "HighCharts_Title"}
]
下面是我的代码
$(function() {
var titleName='';
var options = {
chart: {
renderTo: 'container',
type: 'spline'
},
rangeSelector : {
{
type: 'day',
count: 1,
text: '1 d'
},{
type: 'week',
count: 1,
text: '1 wk'
}, {
type: 'all',
text: 'all'
}],
selected: 1
},
title: {
text: '(IRms & Temperature)'
},
xAxis: {
title: {
text: 'Time (UTC)'
},
type: 'datetime',
labels: {
align: 'left',
formatter: function() {
return Highcharts.dateFormat('%I:%M %P', this.value);
}
},
gridLineDashStyle: 'dot',
gridLineWidth: 1,
tickInterval: 60 * 60 * 1000,
lineWidth: 2,
lineColor: '#92A8CD',
tickWidth: 3,
tickLength: 6,
tickColor: '#92A8CD',
},
yAxis: [{
labels: {
formatter: function() {
return this.value;
}
},
title: {
text: ''
},
opposite: true
},
{
gridLineWidth: 0,
title: {
text: '',
style: {
color: '#4572A7'
}
},
labels: {
formatter: function() {
return this.value +'°F';
}
}
}
],
plotOptions: {
series: {
cursor: 'pointer',
point: {
events: {
...
width: 200
});
sname = this.series.name;
$.getJSON('/em/em/historypointdetail?pointid=' + sname, function(response) {
......
});
}
}
},
marker: {
lineWidth:
}
},
series: []
};
var serialNumber;
$.getJSON('/em/em/lli?id=<c:out value="${elementIds}" />',function(data) {
$.each(data, function(key,value) {
$.each(value, function(key,val) {
if (key == 'name') {
serialNumber = val;
}
else if (key == 'data') {
var dataseries = { data: []};
$.each(val, function(key,val) {
dataseries.data.push(val);
});
dataseries.name=serialNumber;
var names = serialNumber.split('_');
if (names[1] == 'IRms') {
options.title.text = 'Current';
options.series.yAxis = 0;
options.yAxis[0].title.text = 'Current';
}
else if (names[1] == 'Temperature') {
options.title.text = 'Temperature';
options.series.yAxis = 1;
options.yAxis[1].title.text = 'Temperature';
}
options.series.push(dataseries);
}
else if (key == 'title') {
htext = val;
}
});
});
chart = new Highcharts.StockChart(options);
chart.setTitle({text: htext});
}).error(function() {console.log('error');});
$(函数(){
变量titleName='';
变量选项={
图表:{
renderTo:'容器',
类型:“样条线”
},
范围选择器:{
{
键入:'天',
计数:1,
文本:“1D”
},{
键入:“周”,
计数:1,
正文:“1周”
}, {
键入:“全部”,
文字:“全部”
}],
选定:1
},
标题:{
文本:‘(IRms和温度)’
},
xAxis:{
标题:{
文本:“时间(UTC)”
},
键入:“日期时间”,
标签:{
对齐:“左”,
格式化程序:函数(){
返回Highcharts.dateFormat(“%I:%M%P”,此.value);
}
},
gridLineDashStyle:“点”,
网格线宽度:1,
滴答声间隔:60*60*1000,
线宽:2,
线条颜色:“#92A8CD”,
宽度:3,
长度:6,
勾选颜色:“#92A8CD”,
},
亚克斯:[{
标签:{
格式化程序:函数(){
返回此.value;
}
},
标题:{
文本:“”
},
相反:对
},
{
网格线宽:0,
标题:{
文本:“”,
风格:{
颜色:“#4572A7”
}
},
标签:{
格式化程序:函数(){
返回此值+“°F”;
}
}
}
],
打印选项:{
系列:{
光标:“指针”,
要点:{
活动:{
...
宽度:200
});
sname=this.series.name;
$.getJSON('/em/em/historypointdetail?pointid='+sname,函数(响应){
......
});
}
}
},
标记:{
线宽:
}
},
系列:[]
};
序列号;
$.getJSON('/em/em/lli?id=',函数(数据){
$.each(数据、函数(键、值){
$.each(值、函数(键、值){
如果(键=='name'){
serialNumber=val;
}
else if(键==‘数据’){
var dataseries={data:[]};
$。每个(val,函数(键,val){
dataseries.data.push(val);
});
dataseries.name=serialNumber;
变量名称=serialNumber.split(“”);
如果(名称[1]=“IRms”){
options.title.text='Current';
options.series.yAxis=0;
options.yAxis[0].title.text='Current';
}
else if(名称[1]=“温度”){
options.title.text='温度';
options.series.yAxis=1;
options.yAxis[1].title.text='Temperature';
}
options.series.push(dataseries);
}
否则如果(键=='title'){
htext=val;
}
});
});
图表=新的高点图表。股票图表(选项);
chart.setTitle({text:htext});
}).error(函数(){console.log('error');});
我创建了两个Y轴和第二个Y轴,它们的标签返回这个值+F。但是第二Y轴
绘制图表时不显示标签
感谢在向不同的yAxis添加系列时,您需要指定该yAxis的索引或ID,例如:
var dataseries = { data: [], yAxis: 1};