jQuery Flot无法显示图表数据
我正在使用伟大的图表插件Flot将html页面中的字符串替换为图表。然而,不知何故,情节本身并没有表现出来 占位符:jQuery Flot无法显示图表数据,jquery,flot,Jquery,Flot,我正在使用伟大的图表插件Flot将html页面中的字符串替换为图表。然而,不知何故,情节本身并没有表现出来 占位符: <div class="chart" id="example1" style="width:300px; height:150px">2009:12.90,2010:12.80,2011:13.90,2012:14.50</div> <div class="chart" id="example2" style="width:300px;height:
<div class="chart" id="example1" style="width:300px; height:150px">2009:12.90,2010:12.80,2011:13.90,2012:14.50</div>
<div class="chart" id="example2" style="width:300px;height:150px">1:2,2:1,3:6,4:3</div>
当我用实际数据替换d1时,它可以工作。我怀疑这与以字符串或其他形式呈现的数据有关。但我还是做不好。我不想将数据添加到jquery调用中,因为我使用了cms,因此用户可以在编辑页面时更改图表数据。是的,这是因为您将数据创建为一个大字符串,而不是一个值数组。以这条线为例:
chartdata[i] = "[" + val.replace(":","," ) + "]";
您应该(大致)使用如下代码:
values = val.split(":");
chartdata[i] = [parseInt(values[0]), parseInt(values[1])];
$(".chart").each(function() {
var id = this.id;
var data = $("#" + id).html().split(",");
$.map(data, function(point) {
return $.map(point.split(":"), function(value) {
return parseInt(value);
});
});
$.plot("#" + id, [{
data: data,
lines: {
show: true,
fill: true
}
}]);
});
剩下的大部分代码都是不必要的;obj已经是一个列表
通过使用jQuery的“map”而不是“each”,可以简化整个过程;这样,您甚至不需要单独的chartdata变量;大致(未经测试)如下:
values = val.split(":");
chartdata[i] = [parseInt(values[0]), parseInt(values[1])];
$(".chart").each(function() {
var id = this.id;
var data = $("#" + id).html().split(",");
$.map(data, function(point) {
return $.map(point.split(":"), function(value) {
return parseInt(value);
});
});
$.plot("#" + id, [{
data: data,
lines: {
show: true,
fill: true
}
}]);
});