javascript - 无法将数组显示到图表

Question

我在使用带有 ajax 的 Highcharts 时遇到问题..

我正在制作一个 datasource 来为 highcharts 提供一个数组..

这是数据源

function reportPertanyaan1()
{
    $result = [];
    $this->load->model("surveymodel");
    for ($point=1; $point <=10 ; $point++) { 
        array_push($result, $this->surveymodel->GetData("1",$point));
    }

    echo json_encode($result);
}

这是接收数组的ajax代码

$.ajax({
    url: site_url+"datasource/reportPertanyaan1",
    success: function(data){
        console.log(data);
        pertanyaan1(data);
    }
});

从 console.log(data) 中，我得到了这种数组 [2,1,0,1,1,0,1,0,0,0]

然后，我从该 ajax 调用 pertanyaan1 函数。这是代码

function pertanyaan1(jawaban){
    $('#container1').highcharts({
        chart: {
            type: 'line'
        },
        title: {
            text: ''
        },
        xAxis: {
            categories: ['1', '2', '3','4', '5', '6','7', '8', '9','10']
        },
        yAxis: {
            title: {
                text: 'Banyak Data'
            }
        },
        series: [{
            name: 'Pertanyaan 1',
            data: jawaban
        }],
    });
}

而且代码没有显示图表。但是它加倍了 xAxis 标签，看起来像这样

但是，当我将 data: jawaban 替换为 data: [2,1,0,1,1,0,1,0,0,0]。图表可以显示数据..

所提供的任何帮助

Answer 1

实际上，您正在从 ajax 调用中获取 JSON。您需要将其定义为 Js 对象。并且不要将您的数据作为数组发送。将您的数据作为对象发送。

试试这个:

$data= [];
$this->load->model("surveymodel");
for ($point=1; $point <=10 ; $point++) { 
    array_push($data, $this->surveymodel->GetData("1",$point));
}

$result = new stdClass();
$result->data = $data;
echo json_encode($result);

并获取如下数据:

$.ajax({
    url: site_url+"datasource/reportPertanyaan1",
    success: function(result){
        var resultData = JSON.parse(result);
        pertanyaan1(resultData.data);
    }
});