Question

尝试使用库Echarts绘制散点图时遇到一些麻烦。无法将控制器中的JSON（或任何类型）数据加载到Echarts选项

我的JS中有这个

var url = $( "#scatter" ).data( "url" );
var myChart = echarts.init(document.getElementById('scatter'));

myChart.setOption({
        tooltip: {},
        xAxis: {
            data: []
        },
        yAxis: {
            data: []
        },
        series: {
            symbolSize: 10,
            type: 'scatter'
        }
    });

$.post(url, function(data){    
    var datos = $.parseJSON(data);
    myChart.setOption({
        xAxis: {
            data: datos.pci
        },
        yAxis: {
            data: datos.cercania
        }
    });
});

数据来自此控制器：

public function get_factibles(){
        $elementos = $this->oportunidades_md->getProductosFactibles();
        $productos = "[";
            foreach ($elementos as $elem) {
                $productos.= '{"pci": '.$elem->pci.',"cercania": '.$elem->cercania.',"id_producto": '.$elem->id_producto.',"ing": "'.str_replace('"','',$elem->ing).'","esp": "'.str_replace('"','',$elem->esp).'","sector": "'.str_replace('"','',$elem->categoria).'"},';
                            }
        $productos = substr($productos,0,-1);
        $productos .= "]";

        echo $productos; 
    }

当我使用console.log检查时，我可以看到数据正确显示为一个对象。但是我在控制台中收到此错误

Uncaught TypeError: Cannot read property '0' of undefined
    at r.getLabel (echarts.min.js:24)
    at r.a.getTicksLabels (echarts.min.js:12)
    at Object.h.getFormattedLabels (echarts.min.js:11)
    at r.a [as getFormattedLabels] (echarts.min.js:12)
    at t.exports (echarts.min.js:23)
    at r.getLabelInterval (echarts.min.js:23)
    at n (echarts.min.js:23)
    at render (echarts.min.js:23)
    at a.<anonymous> (echarts.min.js:1)
    at Array.forEach (<anonymous>)

如果您登录官方网站(here)，实际上是相同的，但是仍然无法正常工作。怎么可能？我正在使用Codeigniter和PostgreSQL

Answer 1

已解决。

数据未加载，因为我没有在文件开始时添加

$(function(){    

    if ($('#scatter').length ) {

图表无法读取我的JSON文件（写正确），所以我不得不制作一个数组以显示点

var puntos = new Array();            
    for (var i = 0; i < datos.length; i++) {
    puntos[i] = [datos[i].cercania , datos[i].pci, datos[i].id_producto, datos[i].esp, datos[i].ing, datos[i].sector];
};

谢谢！

在Echarts中加载数据时出错

1 个答案: