/api/examples/bing.html

http://webglearth.googlecode.com/ · HTML · 31 lines · 28 code · 3 blank · 0 comment · 0 complexity · 4cd2bd5f11c97cd1c3fdfb2814053326 MD5 · raw file

  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <script src="http://www.webglearth.com/api.js"></script>
  5. <script>
  6. var earth;
  7. var bingA, bingAWL, bingR;
  8. function initialize() {
  9. var options = { zoom: 3, position: [49.190791, 16.61165], proxyHost: 'http://data.webglearth.com/cgi-bin/corsproxy.fcgi?url=' };
  10. earth = new WebGLEarth('earth_div', options);
  11. // Get your own key from: https://www.bingmapsportal.com/
  12. var bingKey = 'AsLurrtJotbxkJmnsefUYbatUuBkeBTzTL930TvcOekeG8SaQPY9Z5LDKtiuzAOu';
  13. bingA = earth.initMap(WebGLEarth.Maps.BING, ['Aerial', bingKey]);
  14. bingAWL = earth.initMap(WebGLEarth.Maps.BING, ['AerialWithLabels', bingKey]);
  15. bingR = earth.initMap(WebGLEarth.Maps.BING, ['Road', bingKey]);
  16. earth.setBaseMap(bingAWL);
  17. }
  18. </script>
  19. </head>
  20. <body onload="initialize()">
  21. <h1>WebGL Earth API: Bing Maps</h1>
  22. <div id="earth_div" style="width:600px;height:400px;border:1px solid gray; padding:2px;"></div>
  23. Click to switch the map:
  24. <a href="#" onClick="earth.setBaseMap(bingR); return false;">Road</a>
  25. <a href="#" onClick="earth.setBaseMap(bingAWL); return false;">Aerial with labels</a>
  26. <a href="#" onClick="earth.setBaseMap(bingA); return false;">Aerial</a>
  27. </body>
  28. </html>