Question

我需要将数值数据显示为网页上的图表，并且我发现JQPlot看起来是最简单的JQuery库之一，并且是免费的。然而，尽管我努力在他们的网页上查看示例和教程，但我根本无法在页面上显示任何类型的图表。这是我的代码，仅用于开始的基本图表：

<html>

<head>
<title>Testing plots functions</title>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript" src="JQPlot/plugins/jqplot.canvasTextRenderer.min.js"></script>
<script type="text/javascript" src="JQPlot/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>

Here is the start of the page...<br>

<div id="chart1"></div>

</body>

</html>

大部分代码都直接来自他们的示例网页（http://www.jqplot.com/tests/line-charts.php），所以我不知道为什么页面上没有发生任何事情。

Answer 1

您的计算机和此文件夹结构中是否存在这些文件？

JQPlot /插件/ jqplot.canvasAxisLabelRenderer.min.js
JQPlot / plugins / jqplot.canvasTextRenderer.min.js

编辑：

确保您也包含基本文件（jquery.jqplot.min.js）（在这些页面上很容易错过）

http://www.jqplot.com/src/jquery.jqplot.min.js

Answer 2

尝试在Javascript / Jquery代码之前放置'div'组件。

有可能Jquery无法找到'div'。

首先定义div，然后编写显示图表的代码。

Answer 3

您需要在渲染器JS之前包含主jqPlot JS，但在jQuery包含之后，在放置脚本以呈现图表之前将div放在页面上。

Answer 4

虽然这个帖子有点旧，但请考虑以下几点：

将容器（目标）添加到您希望绘图的网页。一定要给你的目标一个宽度和高度：

<div id="chartdiv" style="height:400px;width:300px; "></div>

（取自this page）

这是我对您的代码的第一印象。您尚未正确定义容器。

希望它会对某人有所帮助。

Answer 5

一些附加要点：

1：确保您以相同的顺序（如jqPlot网站）提供了所有必需的JS和CSS文件的链接。

2：检查Firebug控制台，有时它很有帮助。

希望这有帮助。

谢谢！

JQPlot基本图表不显示

5 个答案: