我使用highstocks.js来创建比较图,但由于我已经计算了三条曲线的数据,因此将它们放入一个变量中并将它们分开以得到我个人的json。
msg=[[1384972200000,2],[1385058600000,4],[1385145000000,5]]~~[[1384972200000,0],[1385058600000,0]]~~[[1384972200000,1],[1385058600000,1],[1385145000000,1]]
var data = msg.split("~~");
由于我有三条曲线,因此我有一个不使用getJSON的循环,因此我删除了它并只调用了函数
$(function() {
var seriesOptions = [],
yAxisOptions = [],
seriesCounter = 0,
names = ['Requested', 'Submitted', 'Approved'],
colors = Highcharts.getOptions().colors;
var data;
$.ajax({
type: "POST",
url: "highstockPPAP.cgi",
})
.done(function( msg ) {
data = msg.split("~~");
});
$.each(names, function(i, name) {
//as Iam not using this getJSON how to remove it
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename='+ name.toLowerCase() +'-c.json&callback=?',function test() {
var newdata=JSON.parse(data[i]);
seriesOptions[i] = {
name: name,
data: newdata
};
// As we're loading the data asynchronously, we don't know what order it will arrive. So
// we keep a counter and create the chart when all the data is loaded.
seriesCounter++;
if (seriesCounter == names.length) {
createChart();
}
});
});
// create the chart when all data is loaded
function createChart() {
Highcharts.setOptions({
global: {
useUTC: false
}
});
$('#container').highcharts('StockChart', {
chart: {
},
rangeSelector: {
selected: 4
},
xAxis: {
type: 'datetime',
ordinal: false, //this sets the fixed time formats
},
yAxis: {
//labels: {
// formatter: function() {
//return(this.value);
// return (this.value > 0 ? '+' : '') + this.value + '%';
// }
//},
plotLines: [{
value: 0,
width: 2,
color: 'silver'
}]
},
plotOptions: {
//series: {
// compare: 'percent'
//}
},
tooltip: {
// pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b><br/>',
valueDecimals: 0
},
series: seriesOptions,
exporting: {
enabled: false
}
});
}
});
});
当我删除getJSON并且只保留函数时,没有加载任何内容。 怎么办?
答案 0 :(得分:1)
更改json并在一个json中传递所有值
[[[1384972200000,2],[1385058600000,4],[1385145000000,5]],[[1384972200000,0],[1385058600000,0]],[[1384972200000,1],[1385058600000,1],[1385145000000,1]]]
并使用以下链接access the json elements as array最终的javascript如下:
$( document ).ready(function() {
$(function() {
var seriesOptions = [],
yAxisOptions = [],
seriesCounter = 0,
names = ['Requested', 'Submitted', 'Approved'],
colors = Highcharts.getOptions().colors;
$.getJSON('highstockPPAP.cgi',function (data) {
alert(data[0]);
$.each(names, function(i, name) {
seriesOptions[i] = {
name: name,
data: data[i]
};
// As we're loading the data asynchronously, we don't know what order it will arrive. So
// we keep a counter and create the chart when all the data is loaded.
seriesCounter++;
if (seriesCounter == names.length) {
createChart();
}
});
});
// create the chart when all data is loaded
function createChart() {
Highcharts.setOptions({
global: {
useUTC: false
}
});
$('#container').highcharts('StockChart', {
chart: {
},
rangeSelector: {
selected: 4
},
xAxis: {
type: 'datetime',
ordinal: false, //this sets the fixed time formats
},
yAxis: {
plotLines: [{
value: 0,
width: 2,
color: 'silver'
}]
},
plotOptions: {
},
tooltip: {
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b><br/>',
valueDecimals: 0
},
series: seriesOptions,
exporting: {
enabled: false
}
});
}
});
});
答案 1 :(得分:0)
好吧,让我们尝试更改代码中的一些内容:
1)将您的消息更改为:
msg= [
[ [[1384972200000,2],[1385058600000,4],[1385145000000,5]] ],
[ [[1384972200000,0],[1385058600000,0]] ],
[ [[1384972200000,1],[1385058600000,1],[1385145000000,1]] ]
]
所以你将有三个数组,这将是正确的JSON。然后,您将不需要使用拆分和解析数据。
2).ajax()完成后创建图表,参见:
$.ajax({
type: "POST",
url: "highstockPPAP.cgi",
}).done(function( data ) {
$.each(data, function(i, d) {
seriesOptions[i].data = d;
});
createChart();
});
3)删除下一个():
$.each(names, function(i, name) { ... } );