add mapType to allow changing map's type (e.g. roadmap, satellite...)

GoogleWebComponents · Apr 7, 2014 · 42464b0 · 42464b0
1 parent f5a0a94
commit 42464b0
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/google-map.html b/google-map.html
@@ -19,7 +19,7 @@
 
 <link rel="import" href="../polymer/polymer.html">
 
-<polymer-element name="google-map" attributes="latitude longitude zoom showCenterMarker version sensor map">
+<polymer-element name="google-map" attributes="latitude longitude zoom showCenterMarker version sensor map mapType">
   <template>
     <style>
       :host {
@@ -71,6 +71,7 @@
         longitude: '-122.41942',
         zoom: 10,
         showCenterMarker: false,
+        mapType: '', // roadmap, satellite, hybrid, terrain
         version: '3.exp',
         sensor: false,
         observe: {
@@ -110,6 +111,11 @@
             this.map.setZoom(Number(this.zoom));
           }
         },
+        mapTypeChanged: function() {
+          if (this.map) {
+            this.map.setMapTypeId(this.mapType);
+          }
+        },
         showCenterMarkerChanged: function() {
           if (!this.map) {
             return;

diff --git a/metadata.html b/metadata.html
@@ -2,6 +2,7 @@
   <template>
     <google-map style="width: 400px; height: 400px; display: block;"></google-map>
   </template>
+  <property name="mapType" kind="select" options="roadmap,satellite,hybrid,terrain"></property>
   <template id="imports">
     <link rel="import" href="google-map.html">
   </template>