谷歌圖表不顯示在jsp中

Question

我從DAO獲取對象列表，並將其設置為會話屬性以在其他jsps中訪問它，如下所示

list<PlayerBean> playerList=serviceDao.getPlayerData();
session.setAttribute("playerlist",playerList);

PlayerBean具有2個屬性1.playerName 2.runsscored

現在我正在嘗試在jsp中顯示播放器名稱與運行分數的條形圖，並且我正在使用google chart api，如下所示

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Graphical View</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">

google.charts.load('current', {packages: ['corechart', 'bar']});
google.charts.setOnLoadCallback(drawBasic);

function drawBasic()
{
var data = google.visualization.DataTable();
data.addColumn('string', 'Player Name');
data.addColumn('number', 'Runs Scored');

<c:forEach items="${playerlist}" var="listplayers">
data.addRow('${listplayers.playerName}',${listplayers.runsscored});
</c:forEach>

  var options = {
    title: 'Player Name vs Number of runs scored',
    hAxis: {
      title: 'Player Name'
    },
    vAxis: {
      title: 'Runs Scored'
    }
  };

  var chart = new google.visualization.ColumnChart(
    document.getElementById('chart_div'));

  chart.draw(data, options);
}}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>

但是在jsp中什么也沒有顯示。

我試圖檢查元素並在chrome中查看頁面源，如下所示

<html>
<head>
  <title>Graphical View</title>
  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <script type="text/javascript">
    google.charts.load('current', {packages: ['corechart', 'bar']});
    google.charts.setOnLoadCallback(drawBasic);

    function drawBasic() {
      var data = google.visualization.DataTable();

      data.addColumn('string', 'Player Name');
      data.addColumn('number', 'Runs Scored');

      data.addRow('John',250);
      data.addRow('sachin',165); 
      data.addRow('ponting',54); 
      data.addRow('richards',320);

      var options = {
        title: 'Player Name vs Number of runs scored',
        hAxis: {
          title: 'Player Name'
        },
        vAxis: {
          title: 'Runs Scored'
        }
      };

      var chart = new google.visualization.ColumnChart(
        document.getElementById('chart_div'));

      chart.draw(data, options);
    }
  </script>
</head>
<body>
  <div id="chart_div"></div>
</body>
</html>

這是否意味着瀏覽器正在獲取數據但未顯示？ 誰能幫助我解決確切的問題？ 並請提出解決方案。

提前致謝，

Answer 1

首先，在創建數據表時添加new關鍵字

var data = new google.visualization.DataTable()

添加括號，

addRow，它必須是一個數組，或者為null

data.addRow(['${listplayers.playerName}',${listplayers.runss‌cored}])

谷歌圖表不顯示在jsp中

問題描述

1 個解決方案

解決方案1
1 已采納 2017-04-09 09:47:11

谷歌圖表不顯示在jsp中

問題描述

1 個解決方案

解決方案1 1 已采納 2017-04-09 09:47:11

解決方案1
1 已采納 2017-04-09 09:47:11