jqPlot条形图未显示在Chrome和Mozilla中

Question

I am trying to display bar chart using jqPlot bar chart. 我正在尝试使用jqPlot条形图显示条形图。 I have doing code which display chart in Internet Explorer. 我正在执行在Internet Explorer中显示图表的代码。 But for same code chart does not displayed in Crome and Mozilla browser. 但是对于相同的代码表，不会在Crome和Mozilla浏览器中显示。 I have given the code below- 我在下面给出了代码-

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page session="false" %>
<html>
<head>
<style>
<title>Home</title>
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="https://github.com/douglascrockford/JSON-js/blob/master/json2.js">           </script>
<script type="text/javascript" src="../resources/jQuery/jquery.min.js"></script>
<script type="text/javascript" src="../resources/jQuery/jquery.jqplot.min.js"></script>
<script type="text/javascript" src="../resources/jQuery/plugins/jqplot.barRenderer.min.js"></script>
<script type="text/javascript" src="../resources/jQuery/plugins/jqplot.pieRenderer.min.js"></script>
<script type="text/javascript" src="../resources/jQuery/plugins/jqplot.categoryAxisRenderer.min.js"></script>
<script type="text/javascript" src="../resources/jQuery/plugins/jqplot.pointLabels.min.js">   </script>
<link rel="stylesheet" type="text/css" href="../resources/jQuery/jquery.jqplot.min.css" />

<script>
function drawChart() {
alert("In draw chart");
  var s1 = [2, 6, 7];
  var s2 = [7, 5, 3];
  var s3 = [2, 3, 5];
  var s4 = [1, 7, 2];

  // chart data
  var dataArray = [s1, s2, s3, s4];

  // x-axis ticks
  var ticks = ['Jan', 'Feb', 'Mar'];

  // chart rendering options
  var options = {
    seriesDefaults: {
      renderer:$.jqplot.BarRenderer
    },
    axes: {
      xaxis: {
        renderer: $.jqplot.CategoryAxisRenderer,
        ticks: ticks
      }
    }
  };

  // draw the chart
  $.jqplot('showData', dataArray, options);
}// end
</script>
</head>
<body>

<button value="Get Employee Data" onclick="drawChart()">Get Chart</button>
<div id="showData" style="height: 400px; width: 400px;"></div>


</body>
</html>

Why this code does not work for Crome and Mozilla browser? 为什么此代码对Crome和Mozilla浏览器不起作用？

Answer 1

I was able to get the graph displaying in IE9, FF and Chrome by: 我能够通过以下方式在IE9，FF和Chrome中显示图表：

Removing the <style> tag. 删除<style>标记。 This tag prevented anything displaying in all browsers. 此标记阻止任何内容在所有浏览器中显示。
Adding <!DOCTYPE html> at the top of the file. 在文件顶部添加<!DOCTYPE html> 。 This prevented an error in IE9. 这样可以防止IE9中的错误。

Also, the way you are linking to json2.js is actually retrieving the Github page that displays the file, not the actual file itself. 另外，链接到json2.js方式实际上是检索显示文件的Github页面，而不是实际的文件本身。

jqPlot条形图未显示在Chrome和Mozilla中

问题描述

1 个解决方案

解决方案1
1 已采纳 2013-01-09 05:06:23

jqPlot条形图未显示在Chrome和Mozilla中

问题描述

1 个解决方案

解决方案1 1 已采纳 2013-01-09 05:06:23

解决方案1
1 已采纳 2013-01-09 05:06:23