我正在尝试使用数据库数据从canvasjs中创建行garph。但是我在将数据传递到数据点时遇到了问题。
$.ajax({
dataType : "json",
type: "POST",
url: base_url + 'index.php/dashboard/line_graph',
data: {},
success: function(data)
{
for(var i = 0; i < data.length; i++)
{
var firstdate = data[i].nextdate;
var res = firstdate.replace(/[-]/g,',');
fd += '{ x: new Date(' + res + '), y:' + data[i].count +'},';
}
var fin = fd.slice(0,-1);
finals = "[" + fin + "]";
var chart = new CanvasJS.Chart("chartContainer",
{
title:{
text: "Booking - per month (DEMO)"
},
data: [
{
type: "line",
dataPoints: finals
}
]
});
chart.render();
}
});
字符串
当我提醒finals
和复制粘贴报警数据到数据点,然后运行它的工作.但是当包含相同数据的变量被传递给数据点时,它就不工作了。
在控制台日志中,我得到此错误。
TypeError: l.dataPoints[q].x is undefined
型
数据点的格式如下。变量finals
也包含相同的数据,当我做警报。
[
{ x: new Date(2015,03,6), y:4},
{ x: new Date(2015,03,11), y:0},
{ x: new Date(2015,03,16), y:0},
{ x: new Date(2015,03,21), y:0},
{ x: new Date(2015,03,26), y:0},
{ x: new Date(2015,03,31), y:14}
]
型
我的页面返回这个json_encode格式。
[
{"firstdate":"2015-03-01","nextdate":"2015-03-6","count":"4"},
{"firstdate":"2015-03-6","nextdate":"2015-03-11","count":"0"},
{"firstdate":"2015-03-11","nextdate":"2015-03-16","count":"0"},
{"firstdate":"2015-03-16","nextdate":"2015-03-21","count":"0"},
{"firstdate":"2015-03-21","nextdate":"2015-03-26","count":"0"},
{"firstdate":"2015-03-26","nextdate":"2015-03-31","count":"14"}
]
型
我不明白问题所在。请帮帮忙。
5条答案
按热度按时间bd1hkmkf1#
你不需要像字符串一样创建
finals
变量,你可以直接使用JavaScript的对象格式:字符串
x759pob22#
不要把所有东西都创建为字符串:
字符串
yizd12fk3#
你可以在视图中构建数组数据,使用php的变量循环,例如:
字符串
之后,使用这个新的var设置dataPoint:
dataPoints:当前月份
o3imoua44#
CanvasJS只允许你传递像x,y,label,IndexLabel这样的东西。因此,如果您想传递下钻数据的ID(或多个ID),则不能。我试着想个办法。我唯一想到的就是创造一个虚拟系列。我将indexLabel设置为dummy series,使其成为JSON数据字符串。然后当我单击时,我可以从e.dataPointIndex中获得y轴索引
字符串
具有click功能的系列如下所示:
型
metric_id对于所有数据都是相同的,因此它是正确的和可访问的。
然后我可以通过引用var index = e在伪序列中查找该列的数据。dataPointIndex //clicked y column从0开始,所以2是第三个y列的数据。
型
在构造图表的JSON中,我添加了虚拟系列
型
8gsdolmq5#
传递数据,如dataPoints:JSON.parse(data)
而不是dataPoints:数据,数据