我正在使用Google api在我的JSP页面中生成饼图，但是我收到以下错误“Uncaught TypeError：无法读取未定义的属性'arrayToDataTable'”
以下是我的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<%@ page import="java.util.ArrayList" %>
<%@ page import="java.io.*" %>
<%@ page import="java.util.*" %>
<%@ page import="org.apache.commons.io.FileUtils" %>
<%@ page import="java.nio.file.Files"%>
<%@ page import="java.nio.file.Files"%>
<%@ page import="org.apache.commons.io.filefilter.WildcardFileFilter"%>
<%@ page import="org.apache.commons.io.filefilter.DirectoryFileFilter"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.Statement"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import = "javax.servlet.*,java.text.*" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<script src="js/jquery-1.11.1.js" type="text/javascript"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script>
// Load google charts
google.charts.load('current', {'packages':['corechart']});
//google.charts.setOnLoadCallback(drawChart);
// Draw the chart and set the chart values
function drawChart(Passed,Failed) {
var data = google.visualization.arrayToDataTable([
['Task', 'Passed/Failed'],
['Passed', Passed],
['Failed', Failed],
]);
// Optional; add a title and set the width and height of the chart
var options = {'title':'EPRISM automation Status', 'width':400, 'height':300};
// Display the chart inside the <div> element with id="piechart"
var chart = new google.visualization.PieChart(document.getElementById('piechart'));
chart.draw(data, options);
}
</script>
<style>
.box{
display: none;
hide: { fixed: true }
width : 100%;
}
a:hover + .box,.box:hover
{
display: block;
position: relative;
z-index: 100;
hide: { fixed: true }
}
#rajaram {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#rajaram td, #rajaram th {
border: 1px solid #ddd;
padding: 8px;
}
#rajaram tr:nth-child(even){background-color: #f2f2f2;}
#rajaram tr:hover {background-color: #ddd;}
#rajaram th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #4CAF50;
color: white;
}
</style>
</head>
<body oncontextmenu="return false">
<%!
String fname ="";
int passed = 0;
int failed = 0;
HashMap<String,Integer> hm = new HashMap<String,Integer>();
%>
<center><h1>EPRISM DASHBOARD</h1></center>
<form id="cvision" name="cvison" action = "/db/rajakannuri" method="POST" >
<center><table id="rajaram" style="width:50%">
<tr>
<th>CARRIER</th>
<th>DATE</th>
</tr>
<tr id ="ram">
<%
try{
Class.forName("com.mysql.jdbc.Driver");
String url="jdbc:mysql://localhost:3306/eprism_dashboard";
String username="root";
String password="@1RAJAram1.@";
Connection connection = DriverManager.getConnection(url, username, password);
PreparedStatement pstmt = (PreparedStatement) connection.prepareStatement("SELECT DISTINCT CARRIER_NAME FROM eprism_reports");
ResultSet resultSet = pstmt.executeQuery();
%>
<Center><td>
<select name="release" id="module">
<option value="" disabled selected>Please Select CARRIER</option>
<option value = "ALL">ALL CARRIERS</option>
<%
while(resultSet.next()){
fname = resultSet.getString("CARRIER_NAME"); %>
<option value="<%=fname%>"><%=fname%></option>
<%
}
%>
</select></td></center>
<%
connection.close();
} catch (Exception e) {
out.println(e);
}
%>
<Center><td><input type="date" id="datepicker" name = "dateFrom" onchange="this.form.submit()"/></td></center></tr>
</table>
</br>
<%
if(request.getParameter("release")!=null)
{
String tagName = request.getParameter("release");
try{
Class.forName("com.mysql.jdbc.Driver");
String url="jdbc:mysql://localhost:3306/eprism_dashboard";
String username="root";
String password="@1RAJAram1.@";
Connection connection = DriverManager.getConnection(url, username, password);
if(!(request.getParameter("release").equals("ALL")))
{
PreparedStatement pstmt = (PreparedStatement) connection.prepareStatement("SELECT *,CLAIM_TYPE FROM eprism_dashboard.eprism_reports where CARRIER_NAME='"+tagName+"'"+
"AND RERUN = (SELECT MAX(RERUN)"+
"FROM eprism_dashboard.eprism_reports Where CARRIER_NAME ='"+tagName+"')");
ResultSet resultSet = pstmt.executeQuery();
hm = new HashMap<String,Integer>();
%>
<table border="2">
<tr>
<td>CARRIER_NAME</td>
<td>CLAIM_TYPE</td>
<td>STATUS</td>
<td>DATE</td>
<td>RERUN_COUNT</td>
</tr>
<%
while(resultSet.next()){
%>
<tr><td><%=resultSet.getString("CARRIER_NAME")%></td>
<td><%=resultSet.getString("CLAIM_TYPE")%></td>
<td><%=resultSet.getString("STATUS")%></td>
<td><%=resultSet.getString("DATE")%></td>
<td><%=resultSet.getString("RERUN")%></td></tr>
<%
}
%>
</table>
<%
}
else{
PreparedStatement pstmt = (PreparedStatement) connection.prepareStatement("SELECT COUNT(*) as STATUSCOUNT, status FROM eprism_dashboard.eprism_reports where CARRIER_NAME!='QA_EPRISM' GROUP BY Status");
ResultSet resultSet = pstmt.executeQuery();
hm = new HashMap<String,Integer>();
while(resultSet.next()){
hm.put(resultSet.getString("status"),resultSet.getInt("STATUSCOUNT"));
}
if(hm.get("Failed")==null)
{
passed =hm.get("Passed");
failed = 0;
}
else if(hm.get("Failed")==null)
{
passed = 0;
failed = hm.get("Failed");
}
else{
passed =hm.get("Passed");
%><%=passed%><%
failed =hm.get("Failed");
%><%=failed%><%
}
%>
<script language="javascript"> drawChart(<%=passed%>,<%=failed%>)</script>
<%
}
connection.close();
} catch (Exception e) {
out.println(e);
}
hm = null;
tagName = null;
}
else
{
%><Center><h3>Please select and Enter all details</h3></Center><%
}
%>
</table>
<div id="piechart" align="left"></div>
</form>
</body>
</html>
任何人都可以帮我解决这个问题。我尝试在谷歌上搜索这个错误我发现了很多答案，但没有一个有效。