6

我需要将数值数据显示为网页上的图表，我发现 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），所以我不知道为什么页面上什么都没有发生。

4

5 回答 5

2

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

于 2013-01-23T00:43:59.807 回答
2

尝试将“div”组件放在 Javascript/Jquery 代码之前。

Jquery 可能无法找到“div”。

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

于 2012-08-24T09:32:01.597 回答
2

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

  • JQPlot/plugins/jqplot.canvasAxisLabelRenderer.min.js
  • JQPlot/plugins/jqplot.canvasTextRenderer.min.js

编辑：

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

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

于 2012-07-25T19:59:27.700 回答
0

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

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

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

（取自本页）

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

希望它会帮助某人。

于 2013-07-25T21:04:11.527 回答
0

一些额外的点：

1：确保您已按照 jqPlot 网站的相同顺序提供所有必需的 JS 和 CSS 文件的链接。

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

希望这可以帮助。

谢谢 ！

于 2016-10-26T12:13:46.417 回答