Hi, This is really bugging me.
My chart works fine when dates are entered but on the bottom left of the page, there is a little yellow icon indicating a javascript error. http://isaac.issharepoint.com/Web%20Part%20Page/solCenterDashboard.aspx Here's part of the error..... Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET CLR 1.1.4322; .NET4.0C; .NET4.0E) Timestamp: Tue, 13 May 2014 14:52:44 UTC Message: Script error Line: 0 Char: 0 Code: 0 URI: https://www.google.com/uds/api/visualization/1.0/ce05bcf99b897caacb56a7105ca4b6ed/format+en,default+en,ui+en,table+en,corechart+en.I.js Message: Script error Line: 0 Char: 0 Code: 0 URI: https://www.google.com/uds/api/visualization/1.0/ce05bcf99b897caacb56a7105ca4b6ed/format+en,default+en,ui+en,table+en,corechart+en.I.js Here's my code. Any ideas? <script type="text/javascript" src="https://www.google.com/jsapi";></script> <style> .conformanceAlternate { background-color:#BDBDBD } .conformanceFooter { font-weight:bold; } #vizTbl tr:last-child { font-weight: bold; } #vizTbl tr:last-child td { background-color: #a7d5b3; } </style> <script type="text/javascript"> //_spBodyOnLoadFunctionNames.push("getDatesFunc"); //The Google Visualization library implements several classes and methods that you'll need to manipulate all charts google.load("visualization", "1", {packages:["corechart", "table"]}); //Functionality for the calendar dates $(function() { $( "#beginDate" ).datepicker( { dateFormat: 'yy-mm-dd', changeMonth: true, changeYear: true } ); $( "#endDate" ).datepicker( { dateFormat: 'yy-mm-dd', changeMonth: true, changeYear: true } ); }); //Declare an array var ticketArray = new Array(); function getDatesFunc() { //Get the dates to compare and subtract var beginDate = $('#beginDate').datepicker("getDate"); var endDate = $('#endDate').datepicker("getDate"); var compDate = endDate - beginDate; if(compDate<0) { alert("Begin Date must be before End Date."); return false; } else { //Get the actual Dates entered by the user var beginDate = $('#beginDate').datepicker({ dateFormat: 'yy-mm-dd' }).val(); var endDate = $('#endDate').datepicker({ dateFormat: 'yy-mm-dd' }).val(); } // Initialize data object to hold chart data for the Table var dataTbl = new google.visualization.DataTable(); dataTbl.addColumn('string', 'Ticket Type'); dataTbl.addColumn('number', 'Total Count'); // Initialize data object to hold data for pie chart var dataPie = new google.visualization.DataTable(); dataPie.addColumn('string', 'Ticket Type'); dataPie.addColumn('number', 'Total Count'); var i = 0; $().SPServices({ operation: "GetListItems", async: false, listName: "TicketType", CAMLViewFields: "<ViewFields><FieldRef Name='Title'></FieldRef></ViewFields>", CAMLQuery: "<Query><OrderBy><FieldRef Name='Title' /></OrderBy></Query>", completefunc: function (xData, Status) { $(xData.responseXML).SPFilterNode("z:row").each(function() { ticketItem = new Object(); ticketItem.Title = $(this).attr("ows_Title"); ticketItem.TotCount = 0; ticketArray[i] = ticketItem; i++; }); } }); var qry = "<Query>" + "<Where>" + "<And>" + "<Gt>" + "<FieldRef Name='StartDate' />" + "<Value Type='DateTime'>"+beginDate+"</Value>" + "</Gt>" + "<Leq>" + "<FieldRef Name='StartDate' />" + "<Value Type='DateTime'>"+endDate+"</Value>" + "</Leq>" + "</And>" + "</Where>" + "</Query>"; $().SPServices({ operation: "GetListItems", async: false, listName: "Ticketing System", CAMLViewFields: "<ViewFields><FieldRef Name='Issue_x0020_Type'></FieldRef><FieldRef Name='StartDate'></FieldRef><FieldRef Name='TicketCategory'></FieldRef></ViewFields>", CAMLQuery: qry, completefunc: function (xData, Status) { $(xData.responseXML).SPFilterNode("z:row").each(function() { for (var x=0; x < ticketArray.length; x++) { //alert("type: "+$(this).attr("ows_TicketCategory")); //if (valSplit($(this).attr("ows_TicketCategory")) == ticketArray[x].Title) if ($(this).attr("ows_Issue_x0020_Type") == ticketArray[x].Title) { ticketArray[x].TotCount += 1; x++; } } }); } }); var totalConfRecCount = 0; //Data for table chart $.each(ticketArray, function (index, value) { dataTbl.addRow([ticketArray[index].Title, ticketArray[index].TotCount]); totalConfRecCount += ticketArray[index].TotCount; }); dataTbl.addRow(["Total Count", totalConfRecCount]); //Data for pie chart $.each(ticketArray, function (index, value) { dataPie.addRow([ticketArray[index].Title, ticketArray[index].TotCount]); }); var options = { pieSliceText: 'value', is3D: false, legend: { position: 'labeled' }, width: 700, height: 400, chartArea: { height: '85%', width: '90%' }, pieStartAngle: 90 }; var tblOption = { showRowNumber: true, height:305, width:200, alternatingRowStyle: true, cssClassNames: { tableRow: 'conformanceAlternate', selectedTableRow: 'conformanceFooter' } }; <!-- Step 4 - Instantiate the Chart class --> var chart = new google.visualization.PieChart(document.getElementById('chart_div')); var table = new google.visualization.Table(document.getElementById('vizTbl')); <!-- Step 6 - Call chart.draw() function, passing in 'data' and 'options' --> chart.draw(dataPie, options); table.draw(dataTbl, tblOption); } </script> <table align="center"> <tr><td style="font-weight:bold">Begin Date:</td><td><input type="text" id="beginDate" style="background-color:#99FFCC"></td></tr> <tr><td style="font-weight:bold">End Date:</td><td><input type="text" id="endDate" style="background-color:#99FFCC"></td></tr> <tr><td colspan="2" align="center"><button type="text" id="submitDates" onclick="getDatesFunc(); return false;">Submit</button></td></tr> </table> <table align="left"> <tr> <td> <table> <tr><td><div id="chart_div" style="width: 700px; height: 80px;"></div></td></tr> </table> </td> <td> <table id="conformTbl"> <tr><td><br /><br /><br /><div id="vizTbl" style="width: 230px; height: 500px;"></div></td></tr> </table> </td> </tr> </table> -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
