| OLD | NEW |
| (Empty) | |
| 1 <!doctype html> |
| 2 <!-- Copyright (c) 2015 Google Inc. All rights reserved. --> |
| 3 <html> |
| 4 <head> |
| 5 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-
scale=1.0, user-scalable=yes"> |
| 6 <title>Google Map demo</title> |
| 7 <script src="../../webcomponentsjs/webcomponents-lite.js"></script> |
| 8 <link rel="import" href="../google-map.html"> |
| 9 <link rel="import" href="../google-map-marker.html"> |
| 10 <link rel="import" href="../google-map-directions.html"> |
| 11 <style> |
| 12 body { |
| 13 margin: 0; |
| 14 height: 100vh; |
| 15 } |
| 16 #controlsToggle { |
| 17 position: absolute; |
| 18 left: 10%; |
| 19 bottom: 10%; |
| 20 } |
| 21 </style> |
| 22 </head> |
| 23 <body fullbleed> |
| 24 |
| 25 <google-map latitude="37.779" longitude="-122.3892" min-zoom="9" max-zoom="11" l
anguage="en"> |
| 26 <google-map-marker latitude="37.779" longitude="-122.3892" |
| 27 title="Go Giants!" draggable="true"> |
| 28 <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/49/San_Fran
cisco_Giants_Cap_Insignia.svg/200px-San_Francisco_Giants_Cap_Insignia.svg.png" /
> |
| 29 </google-map-marker> |
| 30 </google-map> |
| 31 |
| 32 <google-map-directions start-address="Oakland" end-address="Mountain View" langu
age= |
| 33 "en"></google-map-directions> |
| 34 |
| 35 <button id="controlsToggle" onclick="toggleControls()">Toggle controls</button> |
| 36 |
| 37 <script> |
| 38 var gmap = document.querySelector('google-map'); |
| 39 gmap.addEventListener('api-load', function(e) { |
| 40 document.querySelector('google-map-directions').map = this.map; |
| 41 }); |
| 42 |
| 43 function toggleControls() { |
| 44 gmap.disableDefaultUi = !gmap.disableDefaultUi; |
| 45 } |
| 46 </script> |
| 47 </body> |
| 48 </html> |
| OLD | NEW |