0

我对 Javascrip/Jquery/Jqplot 真的很陌生,我正在尝试自学。然后我有一些问题,这段代码是否足以显示一个简单的图表?因为它不工作,它显示一个空白页。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<link rel="stylesheet" type="text/css" href="css/jquery.jqplot.css" />

<script language="javascript" type="text/javascript" src="js/jqplot.canvasTextRenderer.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jqplot.canvasAxisLabelRenderer.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.jqplot.js"></script>
<script language="javascript" type="text/javascript" src="js/jqplot.dateAxisRenderer.js"></script>
<script language="javascript" type="text/javascript" src="js/jqplot.categoryAxisRenderer.js"></script>
<script language="javascript" type="text/javascript" src="js/jqplot.ohlcRenderer.js"></script>
<script language="javascript" type="text/javascript" src="js/jqplot.highlighter.js"></script>
<script language="javascript" type="text/javascript" src="js/jqplot.cursor.js"></script>
<script language="javascript" type="text/javascript" src="js/customCandlestick.js"></script>

<script type="text/javascript">
$(document).ready(function(){
        document.write("<p>It works!!!</p>");
        var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]);
    });
</script>

</head>
<body>
<div id="chart1"></div>
</body>
</html>
4

2 回答 2

0

我也将这个库用于一个项目,它真的很好!..我只是检查了你发布的例子,我发现它是什么导致你出错,你只需要更改 document.write 句子,如果你使用例如 console.log 功能它将起作用。

前任。

$(document).ready(function(){
        console.log("It works!!!");
        var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]);
    });

还有一点很重要的是这个库使用了jquery,所以你需要在jquery引用之后引用jqplot的所有js文件,以避免JQuery no defined错误。

我希望它有帮助!

于 2013-07-16T14:31:30.440 回答
0

你需要删除

document.write('<p>It works!!!</p>');

或将其替换为

document.write('<p>It works!!!</p><div id="chart1"></div>');

您的document.write语句正在用您提到的内容替换您的 html 页面的正文部分(此处为 '< p >It works!</ p >)。

因此,您的 html 页面不再包含任何带有“chart1”id 的 div。当您指定 jqplot 将您的图形绘制在用“chart1”标识的 div 中(并且 document.write 语句已将其删除)时,无法看到您的图形是一种正常行为。

PS : 不需要包含所有关闭的 jqplot 插件来绘制图表。如果它不会变得更复杂,我建议你只包括“css/jquery.jqplot.css”和“js/jquery.jqplot.js”。对于更复杂的图表,只包含必要的插件(例如“js/jqplot.dateAxisRenderer.js”,如果您需要使用日期轴)。

编辑

请在此处查看工作 jsFiddle ,尝试使用两个“document.write”行(尝试评论和取消评论它们)。

于 2013-07-17T05:31:53.933 回答