我正在尝试jqplot只是用于条形图,但无论我尝试什么样的例子,我都会在控制台中收到此错误:
“无法读取未定义的属性'BarRenderer'”
我做了谷歌搜索,但在这方面找不到任何东西,我不明白..任何帮助都会很棒。我正在使用asp.net MVC 4
@{
ViewBag.Title = "View1";
}
<h2>View1</h2>
<script src="~/Scripts/jqPlot/jquery.min.js"></script>
<script src="~/Scripts/jqPlot/jquery.jqplot.min.js"></script>
<script src="~/Scripts/jqPlot/plugins/jqplot.barRenderer.min.js"></script>
<script src="~/Scripts/jqPlot/plugins/jqplot.categoryAxisRenderer.min.js"></script>
<script src="~/Scripts/jqPlot/plugins/jqplot.pointLabels.min.js"></script>
<link href="~/Scripts/jqPlot/jquery.jqplot.css" rel="stylesheet" type="text/css">
<div id="chart1" style="height:400px;width:300px; "></div>
<script>
$(document).ready(function () {
var s1 = [200, 600, 700, 1000];
var s2 = [460, -210, 690, 820];
var s3 = [-260, -440, 320, 200];
// Can specify a custom tick Array.
// Ticks should match up one for each y value (category) in the series.
var ticks = ['May', 'June', 'July', 'August'];
var plot1 = $.jqplot('chart1', [s1, s2, s3], {
// The "seriesDefaults" option is an options object that will
// be applied to all series in the chart.
seriesDefaults: {
renderer: $.jqplot.BarRenderer,
rendererOptions: { fillToZero: true }
},
// Custom labels for the series are specified with the "label"
// option on the series option. Here a series option object
// is specified for each series.
series: [
{ label: 'Hotel' },
{ label: 'Event Regristration' },
{ label: 'Airfare' }
],
// Show the legend and put it outside the grid, but inside the
// plot container, shrinking the grid to accomodate the legend.
// A value of "outside" would not shrink the grid and allow
// the legend to overflow the container.
legend: {
show: true,
placement: 'outsideGrid'
},
axes: {
// Use a category axis on the x axis and use our custom ticks.
xaxis: {
renderer: $.jqplot.CategoryAxisRenderer,
ticks: ticks
},
// Pad the y axis just a little so bars can get close to, but
// not touch, the grid boundaries. 1.2 is the default padding.
yaxis: {
pad: 1.05,
tickOptions: { formatString: '$%d' }
}
}
});
});
</script>
答案 0 :(得分:1)
我重新创建了上面的代码段并且工作正常。您确定脚本顶部的所有文件都已上传到您的服务器吗?我可以复制错误的唯一方法是不上传&#34; jquery.jqplot.min.js&#34;到我的服务器。
未捕获的TypeError:无法设置属性&#39; BarRenderer&#39;的 undefined(匿名函数)@jqplot.barRenderer.min.js:57(匿名 函数)@jqplot.barRenderer.min.js:57
答案 1 :(得分:0)
我遇到过同样的问题它主要与js加载问题有关。将这些参考文件放在主布局页面
中答案 2 :(得分:0)
通过删除View_Layout.cshtml底部的Scripts.Render解决 因为它两次调用jquery。
<div class="container body-content">
@RenderBody()
</div>
@Scripts.Render("~/bundles/jquery") <-- remove this line
@Scripts.Render("~/bundles/bootstrap") <-- remove this line
@RenderSection("scripts", required: false) <-- remove this line
</body>
</html>