i have crested heat-map using google maps js api. locations weighted , color represent weights instead getting red dot fades yellow , green. not test , populating zip codes , weights database
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=visualization"></script> .
function initialize() { geocoder = new google.maps.geocoder(); var mapprop = { center:new google.maps.latlng(40.785091,-73.968285), zoom:11, maptypeid:google.maps.maptypeid.roadmap }; var map=new google.maps.map(document.getelementbyid("googlemap"),mapprop); codeaddress("10001", 6119); codeaddress("10002", 5180); codeaddress("10003", 4110); codeaddress("10004", 899); codeaddress("10005", 520); codeaddress("10006", 599); function codeaddress(zip, noaccidents) { //var address = document.getelementbyid("address").value; geocoder.geocode( { 'address': zip}, function(results, status) { if (status == google.maps.geocoderstatus.ok) { map.setcenter(results[0].geometry.location); var hotspot = results[0].geometry.location; console.log(hotspot + " " + noaccidents); var heatmapzip = [ {location: hotspot, weight: noaccidents} ]; var color =[ "#ff0000", "#00ff00" ]; var heatmap = new google.maps.visualization.heatmaplayer({ data: heatmapzip, radius: 50, dissapating: false }); heatmap.setmap(map); } else { alert("geocode not successful following reason: " + status); } }); } } google.maps.event.adddomlistener(window, 'load', initialize); 
you should use function heatmap.set('gradient', gradient); set color of heat map. color can calculated # of accident, , max , min of # in data set.
i created fiddle that, hope helps.
Comments
Post a Comment