我想创建一个可以在HTML
页面内多次调用的函数,这样我就可以显示多个堆积的条形图。它们不能都在同一个图表中,因为我需要它们之间的一堆其他内容。
我的第一个想法就是编写函数并将数据传递给它,因为我需要创建条形图。我尝试了以下但由于某种原因给我一个错误No plot target specified
。
我也不确定这是否是实现这一目标的最佳或最有效的方法。
感谢有人看看这个!
我以为每次我需要一个栏我都会在HTML中插入以下内容
<script>
var id ='bar_one'; //I also tried document.getElementById('bar_one');
var data1 = [[12, 1]];
var data2 = [[5, 1]];
var data3 = [[3, 1]];
barBuilder(id, data1, data2, data3);
</script>
<div id='bar_one' style="height:75px;width:500px; "></div>
外部JavaScript文件
function barBuilder(id, data1, data2, data3){
var options = {
animate: true,
animateReplot: true,
stackSeries: true,
seriesColors:['#007f00', '#00b200', '#00ff00'],
seriesDefaults: {
renderer: $.jqplot.BarRenderer,
pointLabels: {show: true,location: 'w'},
rendererOptions: {
barMargin: 13,
barDirection: 'horizontal'},
},
axesDefaults:{
tickOptions: {textColor: 'black'}
},
axes:{
yaxis:{renderer: $.jqplot.CategoryAxisRenderer,
showTicks: false,
tickOptions: {showGridline:false, showMark:false}
},
xaxis:{showTicks:false,
show: false,
tickOptions:{showGridline: false},
rendererOptions:{drawBaseline:false}
}
},
grid:{
background:'transparent',
drawBorder: false,
shadow: false}
};
$.jqplot(id, [data1,data2,data2],options);
}
答案 0 :(得分:0)
您正尝试在ID为&#39; bar_one&#39;的div中绘制图表。但每次调用它来绘制同一div中的不同图形时,更好的选择是使用 for loop 动态创建div并将图形值传递给jqplot对象并附加 for < / strong>循环变量到用不同数据创建的id(为了创建每个div的唯一id)。