Hi,
I am trying to do a real time statistical sales chart as and
when we get orders. I have got the chart working properly in IE8 to IE10.
but the charts are not showing up in Chrome or firefox. I see the below
error in Chrome firebug console.
1. Uncaught Error: Invalid type: undefined.
format+en,default+en,geomap+en,gauge+en,corechart+en.I.js:180<http://www.google.com/uds/api/visualization/1.1/65974efe0434ea30c762e76f9f1da7b2/format+en,default+en,geomap+en,gauge+en,corechart+en.I.js>
1. XHR finished loading: "http://nke-lnx-dom-d001:8080/DOMS/USCharts.jsp
".
firebug-lite.js:18994<chrome-extension://bmagokdooijbeehmkpknfglimnifench/firebug-lite.js>
1.
sendfirebug-lite.js:18994<chrome-extension://bmagokdooijbeehmkpknfglimnifench/firebug-lite.js>
2.
sendjquery.js:8706<http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js>
3.
x.extend.ajaxjquery.js:8136<http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js>
4.
x.fn.loadjquery.js:7745<http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js>
5. (anonymous function)
Please find below the code that is working in IE but showing blank pages in
Chrome or firefox.
<script type="text/javascript" language="javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js";></script>
<script type="text/javascript" src="http://www.google.com/jsapi";></script>
<script type="text/javascript">
{
google.load('visualization', '1.1', { callback: function() {
makeRequest("Repeat"); },packages: ['corechart', 'geomap','gauge']});
}
</script>
<script>
function instantTrigger( fn, delayTrigger ) {
setInterval( fn, delayTrigger );
}
</script>
<script type="text/javascript">
$(document).ready(function() {
if(document.getElementById("Report").value=="Minutes"){
if(document.getElementById("EnterpriseCode").value=="NIKEUS"){
instantTrigger( function() {
$("#responsecontainer").load('USCharts.jsp',0,makeRequest("Repeat"));
}, (document.getElementById("refreshRate").value*1000));
}else{
instantTrigger( function() {
$("#responsecontainer").load('Charts.jsp',0,makeRequest("Repeat"));
}, (document.getElementById("refreshRate").value*1000));
}
}
<body>
<form>
<div id="responsecontainer" onload="makeRequest("First")" >
</div>
<div>
</body>
<script>
function makeRequest(calculateTimeDifference) {
var xmlHttpRequest = getXMLHttpRequest();
xmlHttpRequest.onreadystatechange = getReadyStateHandler(xmlHttpRequest);
xmlHttpRequest.open("POST", "ajaxServlet.do", true);
xmlHttpRequest.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");
xmlHttpRequest.send("action=InvokePieChart&startDate="+document.getElementById("startDate").value
+"&endDate=" + document.getElementById("endDate").value + "&fastRate="
+document.getElementById("fastRate").value + "&refreshRate="
+document.getElementById("refreshRate").value
+ "&productId=" +document.getElementById("ProductId").value +
"&enterpriseCode=" +document.getElementById("EnterpriseCode").value +
"&report=" +document.getElementById("Report").value + "&currTime="
+document.getElementById("currTime").value);
var xmlHttpRequest1 = getXMLHttpRequest();
xmlHttpRequest1.onreadystatechange =
getReadyStateHandler(xmlHttpRequest1,"lineVisualization");
xmlHttpRequest1.open("POST", "ajaxServlet.do", true);
xmlHttpRequest1.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");
xmlHttpRequest1.send("action=InvokeLineChart&startDate="+document.getElementById("startDate").value
+"&endDate=" + document.getElementById("endDate").value + "&fastRate="
+document.getElementById("fastRate").value + "&refreshRate="
+document.getElementById("refreshRate").value
+ "&productId=" +document.getElementById("ProductId").value +
"&enterpriseCode=" +document.getElementById("EnterpriseCode").value +
"&report=" +document.getElementById("Report").value + "&currTime="
+document.getElementById("currTime").value);
}
function drawVisualization(xmlCollection) {
After loading the data from db to the data object
var formatter = new google.visualization.NumberFormat({pattern:'$###,###'
, prefix: '$'});
formatter.format(data, 1);
var wrapGeoChart = new google.visualization.ChartWrapper();
wrapGeoChart.setChartType('GeoChart');
wrapGeoChart.setDataTable(data);
wrapGeoChart.setContainerId('geovisualization');
wrapGeoChart.setRefreshInterval(5);
wrapGeoChart.setOptions({'title':'Test Geo Chart',
'width':800,'region':'US' ,'resolution':'provinces','displayMode':'regions',
'height':600,'legend':'none',colorAxis: {minValue:
0,colors:['#00FF00','#006400','#000000']}});
wrapGeoChart.draw();
}
function getReadyStateHandler(xmlHttpRequest,test) {
return function() {
if (xmlHttpRequest.readyState == 4) {
if (xmlHttpRequest.status == 200) {
xmlDoc=xmlHttpRequest.responseText;
if(test== 'lineVisualization'){
drawLineVisualization(xmlDoc);
}else{
drawVisualization(xmlDoc);
}
} else {
}
}
};
}
</script>
Can you please tell me what is missing here?
Thanks,
S.Ganesh
--
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 [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.
