国外的地图就是详细

简介

热力图

<!DOCTYPE html><html><head><style>/* Always set the map height explicitly to define the size of the div
* element that contains the map. */#map{height:100%;}/* Optional: Makes the sample page fill the window. */html,body{height:100%;margin:0;padding:0;}</style></head><body><divid="map"></div><script>varmap;functioninitMap(){map=newgoogle.maps.Map(document.getElementById('map'),{zoom:2,center:{lat:-33.865427,lng:151.196123},mapTypeId:'terrain'});// Create a <script>tagandsettheUSGSURLasthesource.varscript=document.createElement('script');// This example uses a local copy of the GeoJSON stored at// http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_week.geojsonpscript.src='https://developers.google.com/maps/documentation/javascript/examples/json/earthquake_GeoJSONP.js';document.getElementsByTagName('head')[0].appendChild(script);}functioneqfeed_callback(results){varheatmapData=[];for(vari=0;i<results.features.length;i++){varcoords=results.features[i].geometry.coordinates;varlatLng=newgoogle.maps.LatLng(coords[1],coords[0]);heatmapData.push(latLng);}varheatmap=newgoogle.maps.visualization.HeatmapLayer({data:heatmapData,dissipating:false,map:map});}</script><script asyncdefersrc="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=visualization&callback=initMap"></script></body></html>