GeoJSON India
by aybalasubramanian
HTML
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<body>
<div id="map-canvas"></div>
</body>
CSS
html, body, #map-canvas {
height: 100%;
margin: 0;
padding: 0;
}
JavaScript
var map;
var infowindow = new google.maps.InfoWindow();
function initialize() {
map = new google.maps.Map(document.getElementById('map-canvas'), {
zoom: 4,
center: {lat: 20.59, lng: 078.96}
});
// [START snippet-load]
// Load GeoJSON.
map.data.addGeoJson({
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"geometry": {
"title": 'Custom point',
"type": "Point",
"coordinates": [77.2090, 28.6139]
},
"properties": {
"name": "New Delhi",
"description": "India"
}
}, {
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [101.6869, 3.1390]
},
"properties": {
"name": "Kuala Lumpur",
"description": "Singapore"
}
}]
});
map.data.setStyle({title: 'Hovering here???'});
map.data.addListener('click', function(event) {
infowindow.setContent(event.feature.getProperty('name')+"<br>"+event.feature.getProperty('description'));
infowindow.setPosition(event.latLng);
infowindow.setOptions({pixelOffset: new google.maps.Size(0,-34)});
infowindow.open(map);
});
}
google.maps.event.addDomListener(window, 'load', initialize);