0

jqPlot棒グラフを使用して棒グラフを表示しようとしています。InternetExplorerでグラフを表示するコードを実行しています。ただし、同じコードの場合、CromeおよびMozillaブラウザではチャートは表示されません。私は以下のコードを与えました-

<%@ 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>

このコードがCromeおよびMozillaブラウザで機能しないのはなぜですか？

4

1 に答える 1

1

IE9、FF、Chromeでグラフを表示するには、次の方法でグラフを表示できました。

  1. <style>タグを削除し ます。このタグは、すべてのブラウザに何も表示されないようにしました。
  2. <!DOCTYPE html>ファイルの先頭に追加します。これにより、IE9でのエラーが防止されました。

また、リンクする方法はjson2.js、実際のファイル自体ではなく、ファイルを表示するGithubページを実際に取得することです。

于 2013-01-09T05:06:23.910 に答える