JQPlot 基本图表不显示答案

【问题标题】：JQPlot Basic Chart not displayingJQPlot 基本图表不显示
【发布时间】：2012-07-24 08:23:24
【问题描述】：

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

【问题讨论】：

标签： javascript jquery html rendering jqplot

【解决方案1】：

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

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

【讨论】：

是的。奇怪的是，每个都有一个 min.js 和一个常规的 .js 格式。我不知道这是否相关，但你去吧。无论使用哪个扩展，图表仍然不显示。
我也会删除非缩小版本
this jsFiddle 上的图表对我来说很好。包括来自 AWS 存储桶的所有渲染。
好的，检查了你包含 Travis 的链接，它也对我有用，所以它一定与我如何调用这些文件有关。 Nathan——只是为了确保，您的意思是确保我在 HTML 标头中调用该脚本，对吗？
@user1549557 使用 travis 的 jsFiddle 可以确定一个或多个 js 文件没有正确加载

【解决方案2】：

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

Jquery 可能无法找到“div”。

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

【讨论】：

【解决方案3】：

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

【讨论】：

【解决方案4】：

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

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

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

（取自this page）

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

希望对某人有所帮助。

【讨论】：

【解决方案5】：

一些额外的点：

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

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

希望这会有所帮助。

谢谢！

【讨论】：