显示空白的简单 jqPlot

Question

由于某些原因，标题会移动，为图表腾出空间，看起来上面有图表，但图表本身不显示。我不确定为什么会这样，而且 jqplot 站点说这个特定示例不需要插件。

<!doctype html>
<html>
<head>

<title>PJQuery Chart</title>


<script type = "text/javascript" src = "javascripts/jquery-1.11.2.min.js"> 
<script type="text/javascript" src="jqplot/jqplot/src/plugins/jqplot.canvasTextRenderer.min.js"></script>                                                                                                                        
</script>
<script type="text/javascript" src="jqplot/jqplot/src/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
<script type = "text/javascript">

$(document).ready(function(){

var plot1 = $.jqplot ("chart1", [[3,7,9,1,4,6,8,2,5]]);
});

</script>

</head>

<body>
<div id = "chart1"style = "margin-top:20px; margin-left:20px; width:300px;          
height:300px;"></div>

<h1>This is a Heading</h1>

<p>This is a paragraph.</p>

</body>
</html>

Answer 1

我查看了你的代码。

您没有包含主 jqPlot JS 文件 - jquery.jqplot.min.js（或 jquery.jqplot.js）

此外，您在结束 <script> 标签时犯了一些错误。第一个 <script> 标签没有结束标签(<\script>)

确保 <script> 标签的 src 路径是正确的，并且文件存在于那里。

对我来说这很有效，

<!doctype html>
<html>
<head>

<title>PJQuery Chart</title>

<script type = "text/javascript" src = "dist/jquery.min.js"></script>
<script type="text/javascript" src="dist/jquery.jqplot.min.js"></script><!--You have not included this file-->
<script type="text/javascript" src="dist/plugins/jqplot.canvasTextRenderer.min.js"></script>
<script type="text/javascript" src="dist/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>

<script type = "text/javascript">

//Code..
$(document).ready(function(){
    var plot1 = $.jqplot ("chart1", [[3,7,9,1,4,6,8,2,5]]);
});

</script>

</head>

<body>
    <div id="chart1" style="margin-top:20px; margin-left:20px; width:300px; height:300px;"></div>

    <h1>This is a Heading</h1>
    <p>This is a paragraph.</p>
</body>
</html>

此外，请确保首先包含 jquery.jqplot.min.js，然后是插件文件（或任何其他 jqPlot 文件）

希望对您有所帮助。

显示空白的简单 jqPlot

Simple jqPlot showing up blank

javascript

jquery

html

jqplot