jqplot使用dateAxisRenderer行不渲染,有什么想法为什么?
此代码工作完全正常:jqplot使用dateAxisRenderer行不渲染,有什么想法为什么?
<div id="chart1"></div>
然后我的JS:
在我看来$(document).ready(function(){
var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]);
});
当我改变了我的JS(从jqPlot site复制),这样我可以有包括我的x轴仅日期网格示出了没有x轴或线(y轴是准确的和存在的话):
新js代码能源部SNT工作:
$(document).ready(function(){
var line1=[['2011-06-30 8:00AM',4], ['2011-7-30 8:00AM',6]];
var plot2 = $.jqplot('chart1', [line1], {
title:'Customized Date Axis',
gridPadding:{right:35},
axes:{
xaxis:{
renderer:$.jqplot.DateAxisRenderer,
tickOptions:{formatString:'%b %#d, %y'},
min:'May 30, 2011',
tickInterval:'1 month'
}
},
series:[{lineWidth:4, markerOptions:{style:'square'}}]
});
});
注意我只改日期到2011年,改名为一个div为 “chart1”(如果相对于this jQPlot site),并加入jqplot.dateAxisRenderer.min.js的ID。
所以现在我有以下插件包括:
- “jqplot.canvasTextRenderer.min.js”
- “jqplot.canvasAxisLabelRenderer.min.js”
- “jqplot.dateAxisRenderer.min。 JS”
- “jqplot/jqplot.canvasAxisTickRenderer.min.js”
- “jqplot/jquery.jqplot.min.js”
我收到以下错误JS:
Uncaught TypeError: Cannot set property 'CanvasTextRenderer' of undefined in jqplot.canvasTextRenderer.min.js:30.
Cannot set property 'CanvasTextRenderer' of undefined in jqplot.canvasAxisLabelRenderer.min.js:30.
Cannot set property 'CanvasTextRenderer' of undefined in jqplot.dateAxisRenderer.min.js:30.
Cannot set property 'CanvasTextRenderer' of undefined in jqplot.canvasAxisTickRenderer.min.js:30.
我在做什么错在这里?任何帮助将不胜感激。我搜索了两个小时没有成功。
我创建了一个包含上面代码中的普通的HTML页面,它似乎工作。
<html>
<head>
<link type="text/css" href="http://localhost/test1/atk4-addons/sterling/jqplot/templates/js/jqplot/jquery.jqplot.css" rel="stylesheet" />
<script type="text/javascript" src="http://localhost/test1/atk4/templates/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="http://localhost/test1/atk4-addons/sterling/jqplot/templates/js/jqplot/jquery.jqplot.js"></script>
<script type="text/javascript" src="http://localhost/test1/atk4-addons/sterling/jqplot/templates/js/jqplot/plugins/jqplot.dateAxisRenderer.js"></script>
<script>
$(document).ready(function(){
var line1=[['2011-06-30 8:00AM',4], ['2011-7-30 8:00AM',6]];
var plot2 = $.jqplot('chart1', [line1], {
title:'Customized Date Axis',
gridPadding:{right:35},
axes:{
xaxis:{
renderer:$.jqplot.DateAxisRenderer,
tickOptions:{formatString:'%b %#d, %y'},
min:'May 30, 2011',
tickInterval:'1 month'
}
},
series:[{lineWidth:4, markerOptions:{style:'square'}}]
});
});
</script>
</head>
<body>
<div id="chart1"></div>
</body>
</html>
其在Windows 7
我使用jQuery V1.5.1所以也许更新到最新版本,只是再试一次产生下面的输出,我在Firefox 3.6.22以防万一。
我只需要包含jquery.js,jqplot.js和dateAxisRenderer就可以工作,所以也尝试删除其他渲染器,因为我不认为您使用的任何选项都需要它在您提供的代码示例中。
虽然这个代码在隔离很好,我在其他地方了解一些浏览器不加载正确的顺序加载和一切需要的CSS的JavaScript之前加载一个问题一个问题。
您与Ruby on Rails的,所以如果你是从一些框架代码调用此标记这一点,它加载其他的东西为好,说不定还有与顺序,从而改变周围可能有帮助的问题。
一种可能性是,jqPlot插件文件被加载jqPlot主要插件文件加载之前,导致“未定义”的错误。我遇到过你的问题,因为我正在使用RequireJS异步加载依赖关系,并且jqPlot主插件文件与插件文件相比是巨大的,因此首先加载插件文件。
我也遇到过你的问题。有可能,脚本标记中有两个“type”属性?就像这样:
<script type="javascript" type="text/javascript" src="/jqplot/jquery.jqplot.js"></script>
做一个快速复制粘贴错误后,我注意到,如果源链接是<head></head>
标签外我得到这个错误。
<html>
<head>
<title>Awesome graph</title>
</head>
<script type="text/javascript" src="jqplot/plugins/jqplot.logAxisRenderer.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.canvasAxisTickRenderer.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.dateAxisRenderer.min.js"></script>
<body>...
替换head标签中的标签立即解决了这个问题。
<html>
<head>
<title>Awesome graph</title>
<script type="text/javascript" src="jqplot/plugins/jqplot.logAxisRenderer.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.canvasAxisTickRenderer.min.js"></script>
<script type="text/javascript" src="jqplot/plugins/jqplot.dateAxisRenderer.min.js"></script>
</head>
<body>...