Spencer, Wish I could help, but while you are loading google visualization code, you are not using it. The heatmap code you are using is in google.maps.visualization, which is part of google maps, not google visualization. More help on google maps api can be found at: https://developers.google.com/maps/documentation/javascript/forum
I'm not sure it matters, but perhaps you should be calling your initialize function as the examples show: e.g. google.maps.event.addDomListener(window, 'load', initialize); dan On Sun, Oct 13, 2013 at 12:33 PM, Spencer James <[email protected]> wrote: > I'm working on a disease surveillance program using Google's > mapping/visualization API and my heatmap suddenly stopped working a few > days ago, both on the web server and on my local machine. The console error > reads "Failed to load resource: file:// > gg.google.com/csi?s=uds&v=2&action=al_visualization&it=jl.203". > > The map basically 1) doesn't show up and 2) the controls have been shifted > to the left for some reason. > > Originally it looked like this example: > > https://developers.google.com/maps/documentation/javascript/examples/layer-heatmap > > All of the code (that worked previously) is pasted below. I also attached > it to this email. I cobbled it together (partly thanks to the great help on > this forum), but I'm a novice at this so I haven't been able to figure this > out. > > > <!DOCTYPE html> > <html> > <head> > <meta charset="utf-8"> > <title>RICE2: Mobile Disease Surveillance in Vietnam > </title> > <link href=" > https://developers.google.com/maps/documentation/javascript/examples/default.css"; > rel="stylesheet"> > <script type="text/javascript" src="http://www.google.com/jsapi > "></script> > > <script type="text/javascript"> > google.load('visualization', '1.1', {packages: ['controls', > 'corechart']}); > </script> > <style> > a:link {color:#000000;} /* unvisited link */ > a:visited {color:#000000;} /* visited link */ > a:hover {color:#000000;} /* mouse over link */ > a:active {color:#000000;} /* selected link */ > </style> > > <script src=" > https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=visualization > "></script> > > <script> > > var map, pointarray, heatmap; > > var heatmapData = new Array(); > > // Create a <script> tag and set the USGS URL as the source. > var script = document.createElement('script'); > script.src = ' > http://spreadsheets.google.com/feeds/list/0Aurg0HdD8rrFdDFIUE45MzdOUndDUW9taC14ZGRrWnc/1/public/values?alt=json-in-script&callback=importGSS<http://spreadsheets.google.com/feeds/list/0Aurg0HdD8rrFdDFIUE45MzdOUndDUW9taC14ZGRrWnc/1/public/values?alt=json-in-script&callback=importGSS> > '; > document.getElementsByTagName('head')[0].appendChild(script); > > function skeleton() {}; > > if (!gdata) { > var gdata = new skeleton(); } > gdata.io = new skeleton(); > gdata.io.handleScriptLoaded = function(data) > { > gdata(data); > } > > // Loop through the results array and place a marker for each > // set of coordinates. > > function gdata(results){ > for (var i = 0; i < results.feed.entry.length; i++) { > var incident = results.feed.entry[i]; > var latitude = incident.gsx$lat.$t; > var longitude = incident.gsx$long.$t; > var latLng = new google.maps.LatLng(latitude,longitude); > var marker = new google.maps.Marker({ > position: latLng, > map: map > }); > > heatmapData.push(new google.maps.LatLng(latitude,longitude)); > } > } > > var map, pointarray, heatmap; > function initialize() { > > var mapOptions = { > center: new google.maps.LatLng(20.7, 105.3), > zoom: 8, > mapTypeId: google.maps.MapTypeId.TERRAIN > }; > > map = new google.maps.Map(document.getElementById("map_canvas"), > mapOptions); > > var pointArray = new google.maps.MVCArray(heatmapData); > > heatmap = new google.maps.visualization.HeatmapLayer({ > data: pointArray, > dissipating: false, > radius: .12 > }); > > heatmap.setMap(map); > }; > > function toggleHeatmap() { > heatmap.setMap(heatmap.getMap() ? null : map); > } > > function changeGradient() { > var gradient = [ > 'rgba(0, 255, 255, 0)', > 'rgba(0, 255, 255, 1)', > 'rgba(0, 191, 255, 1)', > 'rgba(0, 127, 255, 1)', > 'rgba(0, 63, 255, 1)', > 'rgba(0, 0, 255, 1)', > 'rgba(0, 0, 223, 1)', > 'rgba(0, 0, 191, 1)', > 'rgba(0, 0, 159, 1)', > 'rgba(0, 0, 127, 1)', > 'rgba(63, 0, 91, 1)', > 'rgba(127, 0, 63, 1)', > 'rgba(191, 0, 31, 1)', > 'rgba(255, 0, 0, 1)' > ] > heatmap.setOptions({ > gradient: heatmap.get('gradient') ? null : gradient > }); > } > > function changeRadius() { > heatmap.setOptions({radius: heatmap.get('radius') ? null : .12}); > } > > function changeOpacity() { > heatmap.setOptions({opacity: heatmap.get('opacity') ? null : 0.2}); > } > > > </script> > > </head> > <body onload="initialize()"> > <table cellpadding="0" cellspacing="0"> > <tr> > <td style='width: 50%'> > <div style="font-size: small; font-family: Menlo, Lucida Sans Unicode"> > RICE2: live SMS-based disease surveillance & outbreak detection in > northern Vietnam > </div> > </td> > <td style='width: 50%'> > <div style="font-size: small; font-family: Menlo, Lucida Sans Unicode"><p > align="right"><a href=chart.html>chart</a> | <a href=table.html>table</a> | > <a href=time.html>time</a> | <a href=heatmap.html>heatmap</a> | <a > href=rawdata.html>raw data</a> | <a href=index.html>home</a></p> > </div> > </td> > </table> > <div id="panel" style="top: 37px"> > <button onclick="toggleHeatmap()">Toggle Heatmap</button> > <button onclick="changeGradient()">Change gradient</button> > <button onclick="changeOpacity()">Change opacity</button> > </div> > <div id="map_canvas" style="width:100%"></div> > </body> > </html> > > -- > 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. > -- Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> - 978-394-1058 [email protected] <[email protected]> 562D 5CC, Cambridge MA [email protected] <[email protected]> 9 Juniper Ridge Road, Acton MA -- 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.
