0

阿贾克斯调用:

var dataString = "params="+globalData.cmpThemesData;
$.ajax( {
    type : "POST",
    url : e + "/home/comparethemes",
    dataType : JSON,
    data : dataString,
    beforeSend : function() {
    },
    success : function(data) {

        $.each(data, function(key, value) {

            var series = {}; 
            series.name = value.name;
            series.data = value.value;
            basicLineptions.series.push(series);
        });

            var chart = new Highcharts.Chart(basicLineptions);  
    }
});

来自 Ajax 调用的 JSON 响应:

[{
    "name": "Name1",
    "data": "33100,33100,33100,27100,27100,27100,33100,27100,27100,33100,27100,0"
},
{
    "name": "Name 2",
    "data": "33100,33100,33100,27100,27100,27100,33100,27100,27100,33100,27100,0"
},
{
    "name": "Name 3",
    "data": "33100,27100,33100,33100,33100,27100,27100,22200,27100,33100,74000,0"
},
{
    "name": "Name 4",
    "data": "18100,22200,33100,22200,14800,12100,18100,22200,12100,9900,14800,0"
}]

基本线图选项:

 var basicLineptions = { 
 chart: {
 renderTo: 'content',
type: 'line',
marginRight: 130,
marginBottom: 25
},
title: {
text: 'Compare Theme Data',
x: -20 //center
},
subtitle: {
text: '',
x: -20
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct',         'Nov', 'Dec']
},
yAxis: {
title: {
    text: 'Search Volumes'
},
plotLines: [{
    value: 0,
    width: 1,
    color: '#808080'
}]
},
tooltip: {
valueSuffix: ''
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: [],
exporting: {
   enabled: false
}
};

如何将此 JSON 响应传递给 Highcharts 基本折线图以比较 Jquery 中的数据?

基本折线图数据对比图

这就是我试图通过的方式:

$.each(data, function(key, value){
   var series = {};
   series.name = data.name;
   series.data = data.value;
   basicLineptions.series.push(series);
});
var chart = new Highcharts.Chart(basicLineptions);

谢谢 ...

4

2 回答 2

1

你应该试试这个:

$.each(data, function(key, value) {
   var series = {};     //-^---^---------this should be used to refer the data.
       series.name = value.name; //<-----data should be referenced by value here
       series.data = parseInt(value.value); //<----here data is the key in the json.
       basicLineptions.series.push(series);
});
var chart = new Highcharts.Chart(basicLineptions);

在这里,您必须按函数回调中提供的值引用数据,然后初始化图表。


更新:

您需要使用以下内容进行更新:

var dataString = {"params":globalData.cmpThemesData}; //<---this one send obj
$.ajax({
type : "POST",
url : e + "/home/comparethemes",
dataType : "JSON", //<-------------this one "" should be in quotes
data : dataString,
beforeSend : function() {},
success : function(data) {
    $.each(data, function(key, value) {
        var series = {}; 
        series.name = value.name;
        series.data = parseInt(value.value);
        basicLineptions.series.push(series);
    });
    var chart = new Highcharts.Chart(basicLineptions);  
}
});
于 2013-03-26T06:28:35.670 回答
0

我认为问题出在您的数据(value.value)上。这看起来像一个字符串,它应该是一个数组。尝试:

series.data=value.value.split(",");
于 2013-03-26T08:46:43.460 回答