How to mark each area with polygon on google map?
I am trying to create a map using google map or any other services.
On this map, I want to draw every area inside the city and details.
It looks like the following link .
How can I create it using the Google Maps API? Or is there any way as I did in mymaps option on google maps?
Please advise me.
0
source to share
1 answer
You can use KmlLayer to render polygons (etc.) from your MyMap to Google Maps Javascript API v3 (you need an API key).
The URL was obtained by exporting KML ("Load KML") from MyMap, checking both parameters:
- Keep your data up to date with a KML network link (for web use only).
- Export to .KML file (use .KMZ for full icon support).
Then, using the content <href>
in the resulting file (and removing the HTML entity encoding):
<href>http://www.google.com/maps/d/kml?forcekml=1&mid=1yrtH76JreHzs8bU1-XOoVsEeRS0</href>
snippet of code:
function initialize() {
var map = new google.maps.Map(
document.getElementById("map_canvas"), {
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var kmlLayer = new google.maps.KmlLayer({
url: "http://www.google.com/maps/d/kml?forcekml=1&mid=1yrtH76JreHzs8bU1-XOoVsEeRS0",
map: map
});
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>
+1
source to share