Google Maps API Simple Styled Map Tool
-
Create a map:
var mapOptions = { center: { lat: 51, lng: 0}, zoom: 8 }; var map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
-
Get the JSON:
var json = document.getElementsByTagName('textarea')[0].value;
-
Initialize the app:
var styler = new MapStyler( map, json ); styler.bootstrap();
-
Collect the new creaed JSON:
document.addEventListener('mapStylerUpdate', function(e) { document.getElementsByTagName('textarea')[0].value = e.detail.json; });
-
Locate the Map and the Style Tray in your page:
<div id="style-tray"></div> <div id="map-canvas"></div>