Bing Maps v7 Control

Birdseye view map

by Sarah Godoshian

HTML

<script src="https://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0&amp;s=1"></script>
<div id="mapDiv" class="map"></div>

CSS

.map {
   position: absolute;
   top: 20;
   left: 10;
   width: 100%;
   height: 400px;
   border:#555555 2px solid;
}

JavaScript

const BING_MAPS_API_KEY = 'DLjTBOhW0keEHzQaxaxM~2I0qKZFVPNk6vkY2UExG3g~AkHsb2f4RWOeKDECKHjpyDqEoeS-QW7vH4G2h_MRtos3M8xUGYQGYZeJDrBgUQEW';
const location = {
	latitude: 33.544338,
  longitude: -117.791686,
}
let map = new Microsoft.Maps.Map(document.getElementById('mapDiv'), {
     credentials: BING_MAPS_API_KEY,
     center: new Microsoft.Maps.Location(location.latitude, location.longitude),
     zoom: 20, 
     showScalebar: false,
     useInertia: false,
     disablePanning: true, 
     disableZooming: true, 
     enableSearchLogo: false,
     enableClickableLogo: false,
     showMapTypeSelector:false,
     showDashboard: false,
});
map.setView({mapTypeId : Microsoft.Maps.MapTypeId.birdseye});

let pin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(location.latitude, location.longitude), {icon: 'http://orig04.deviantart.net/4f55/f/2009/218/b/8/hello_kitty_cookie_prize_by_ranafroggie.png', width: 50, height: 50, draggable: false}); 
map.entities.push(pin);