/api/examples/bing.html
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 12 // Get your own key from: https://www.bingmapsportal.com/ 13 var bingKey = 'AsLurrtJotbxkJmnsefUYbatUuBkeBTzTL930TvcOekeG8SaQPY9Z5LDKtiuzAOu'; 14 15 bingA = earth.initMap(WebGLEarth.Maps.BING, ['Aerial', bingKey]); 16 bingAWL = earth.initMap(WebGLEarth.Maps.BING, ['AerialWithLabels', bingKey]); 17 bingR = earth.initMap(WebGLEarth.Maps.BING, ['Road', bingKey]); 18 19 earth.setBaseMap(bingAWL); 20 } 21</script> 22</head> 23<body onload="initialize()"> 24 <h1>WebGL Earth API: Bing Maps</h1> 25 <div id="earth_div" style="width:600px;height:400px;border:1px solid gray; padding:2px;"></div> 26 Click to switch the map: 27 <a href="#" onClick="earth.setBaseMap(bingR); return false;">Road</a> 28 <a href="#" onClick="earth.setBaseMap(bingAWL); return false;">Aerial with labels</a> 29 <a href="#" onClick="earth.setBaseMap(bingA); return false;">Aerial</a> 30</body> 31</html>