JavaScript — Ошибка загрузки данных в Echarts

У меня возникли проблемы с попыткой нарисовать точечную диаграмму с библиотекой 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>)

Если вы проверите на официальном сайте (Вот) это практически то же самое, но все еще не работает. Как это может быть?
Я работаю с Codeigniter и PostgreSQL