Javascript 如何访问highchart工具提示中的任何特定数据?
我正在使用highcharts显示图形 我无法在工具提示中显示时间 如果我在seriesdata对象的数据对象中发送时间,它会正确显示,但不会以相反的方式显示Javascript 如何访问highchart工具提示中的任何特定数据?,javascript,jquery,json,highcharts,Javascript,Jquery,Json,Highcharts,我正在使用highcharts显示图形 我无法在工具提示中显示时间 如果我在seriesdata对象的数据对象中发送时间,它会正确显示,但不会以相反的方式显示 var renderchart = function (seriesData) { chart = new Highcharts.Chart({ chart: { renderTo: 'barGrpahcontainer', type: 'bar',
var renderchart = function (seriesData) {
chart = new Highcharts.Chart({
chart: {
renderTo: 'barGrpahcontainer',
type: 'bar',
backgroundColor: '#d3d3d3',
animation: false
},
title: {
text: ''
},
xAxis: {
opposite: false,
categories: null,
title: {
text: ''
},
labels: {
enabled:false
}
},
yAxis: {
min: 0,
gridLineWidth: 0,
minorGridLineWidth: 0,
title: {
text: ''
},
opposite: true
},
legend: {
enabled: false
},
tooltip: {
formatter: function () {
return '<b>' + this.series.name + '</b><br/>' + this.y + '<br/>' + 'Time: ' + this.time;
}
},
plotOptions: {
series: {
stacking: 'normal',
pointWidth: 20
}
},
series: seriesData
});
}
var dataArray = [{"status":"Program Running","y":0.08,"color":"#01BC01","time":"00:13:47"},{"status":"Program Stopped","y":0.02,"color":"#FEC201","time":"00:03:41"},{"status":"Program Running","y":0.04,"color":"#01BC01","time":"00:07:36"},{"status":"Program Stopped","y":0.0,"color":"#FEC201","time":"00:00:28"},{"status":"Program Running","y":0.0,"color":"#01BC01","time":"00:00:14"},{"status":"Program Stopped","y":0.04,"color":"#FEC201","time":"00:07:45"},{"status":"Program Running","y":0.21,"color":"#01BC01","time":"00:37:43"},{"status":"Program Stopped","y":0.0,"color":"#FEC201","time":"00:00:47"},{"status":"Program Running","y":0.13,"color":"#01BC01","time":"00:24:00"},{"status":"Program Stopped","y":0.01,"color":"#FEC201","time":"00:01:55"},{"status":"Program Running","y":0.04,"color":"#01BC01","time":"00:07:36"},{"status":"Program Stopped","y":0.0,"color":"#FEC201","time":"00:00:19"},{"status":"Program Running","y":0.0,"color":"#01BC01","time":"00:00:16"},{"status":"Program Stopped","y":0.05,"color":"#FEC201","time":"00:08:52"},{"status":"Program Running","y":0.21,"color":"#01BC01","time":"00:37:46"},{"status":"Program Stopped","y":0.02,"color":"#FEC201","time":"00:02:53"},{"status":"Program Running","y":0.13,"color":"#01BC01","time":"00:24:03"},{"status":"Program Stopped","y":0.02,"color":"#FEC201","time":"00:03:24"},{"status":"Program Running","y":0.04,"color":"#01BC01","time":"00:07:50"},{"status":"Program Stopped","y":0.0,"color":"#FEC201","time":"00:00:11"},{"status":"Program Running","y":0.0,"color":"#01BC01","time":"00:00:09"},{"status":"Program Stopped","y":0.0,"color":"#FEC201","time":"00:00:21"},{"status":"Program Running","y":0.0,"color":"#01BC01","time":"00:00:20"},{"status":"Program Stopped","y":1.67,"color":"#FEC201","time":"05:00:27"},{"status":"NO DATA","y":5.26,"color":"#444849","time":"15:47:37"}]
$(function () {
var data = dataArray;
var seriesData = [];
var total = 0;
var i, cat;
var count = 0;
for (i = 0; i < data.length; i++) {
seriesData.push({
name: data[i].status,
data: [data[i].y],
color: data[i].color,
time: data[i].time
});
}
var chart;
$(document).ready(function () {
renderchart(seriesData)
});
});
var renderchart=函数(seriesData){
图表=新的高点图表。图表({
图表:{
renderTo:“barGrpahcontainer”,
类型:'bar',
背景颜色:“#D3”,
动画:错误
},
标题:{
文本:“”
},
xAxis:{
反面:错,
类别:空,
标题:{
文本:“”
},
标签:{
已启用:false
}
},
亚克斯:{
分:0,,
网格线宽:0,
minorGridLineWidth:0,
标题:{
文本:“”
},
相反:对
},
图例:{
已启用:false
},
工具提示:{
格式化程序:函数(){
返回'+this.series.name+'
'+this.y+'
'+'时间:'+this.Time;
}
},
打印选项:{
系列:{
堆叠:“正常”,
点宽度:20
}
},
系列:系列数据
});
}
var dataArray=[{“status”:“Program Running”,“y”:0.08,“color”:“Program Running”,“y”:0.04,“color”:“Program Stopped”,“y”:0.02,“color”:“Program Stopped”,“y”:0.02,“color”:“Program Running”,“y”:0.04,“color”:“Program Running”,“y”:0.04,“color”:“00:07:36”;“status”:“Program Stopped”,“y”:0.0,“color”:“Program Stopped”;“FEC201”,“time”:“00:28”,“Program Running”,“Program Running”,“color”:“#01BC01”,“时间”:“00:00:14”},{“状态”:“程序已停止”,“y”:0.04,“颜色”:“FEC201”,“时间”:“00:07:45”},{“状态”:“程序正在运行”,“y”:0.21,“颜色”:“00:37:43”},{“状态”:“程序已停止”,“y”:0.0,“颜色”:“00:00:47”},{“状态”:“程序正在运行”,“y”:0.13”,“颜色”:“时间”:“状态”:“时间”:“0:00:24”}程序停止,y:0.01,颜色:“#FEC201”,“时间:”“00:01:55”},{“状态:”“程序运行”,“y:0.04”,“颜色:”“01BC01”,“时间:”“00:07:36”},{“状态:”“程序停止”,“y:0.0”,颜色:“#FEC201”,“时间:”“00:00:19”},{“状态:”“程序运行”,“y:0.0”,“颜色:”“01BC01”,“时间:”“00:00:16”},{“状态”“程序停止”,“时间:”“0:05”,“颜色:”“FEC201”:”00:08:52“},{“状态”:“程序运行”,“y”:0.21,“颜色”:“01BC01”,“时间”:“00:37:46”},{“状态”:“程序停止”,“y”:0.02,“颜色”:“FEC201”,“时间”:“00:02:53”},{“状态”:“程序运行”,“y”:0.13,“颜色”:“01 BC01”,“时间”:“00:24:03”},{“状态”:“程序停止”,“y”:0.02,“颜色”:“FEC201”,“时间”:“00:03”,“程序运行”,“时间”:“0.04”{颜色:“#01BC01”,“时间:“#01BC01”,“时间:”,{“状态:”,{“程序停止”,“y”:0.0,“颜色:”,“#FEC201”,“时间:”,{“状态:”,{“程序运行”,“y”:0.0,“颜色:”,“#01BC01”,“时间:”,{“程序停止”,“y”:0.0,“颜色:”,“:“,“时间:”,{“状态:”,“程序运行”,“y”:0.0.0”,“颜色:”,{“状态:”,{“程序运行”,“时间:”,{“0:00:01”,“时间:”,{程序停止,“y”:1.67,“颜色”:“#FEC201”,“时间”:“05:00:27”},{“状态”:“无数据”,“y”:5.26,“颜色”:“#444849”,“时间”:“15:47:37”}]
$(函数(){
var数据=数据数组;
var序列数据=[];
var合计=0;
varⅠ,cat;
var计数=0;
对于(i=0;i
原因是参数,它保存在this.series.options.time
中,而不是this.time
固定格式设置程序:
tooltip: {
formatter: function() {
return '<b>' + this.series.name + '</b><br/>' +
this.y + '<br/>' +
'Time: ' + this.series.options.time;
}
},
工具提示:{
格式化程序:函数(){
返回“+this.series.name+”
+
这个.y+“
”+
“时间:”+this.series.options.Time;
}
},
演示:
- 原因是参数,它保存在
this.series.options.time
中,而不是this.time
固定格式设置程序:
tooltip: {
formatter: function() {
return '<b>' + this.series.name + '</b><br/>' +
this.y + '<br/>' +
'Time: ' + this.series.options.time;
}
},
工具提示:{
格式化程序:函数(){
返回“+this.series.name+”
+
这个.y+“
”+
“时间:”+this.series.options.Time;
}
},
演示: