IDM Map

by Nick Karnik

HTML

<link rel="stylesheet" href="http://ol3js.org/en/master/css/ol.css">
<script src="http://ol3js.org/en/master/build/ol.js"></script>
<div id="map" class="map"></div>

CSS

body {
    margin: 0;
    display: block;
    height: 100%;
    overflow: hidden;
}
map {
    top: 0;
    bottom: 0;
    left: 0;
    right:0;
}

JavaScript

var projectionOptions = {};
var view2DOptions = {};
view2DOptions.zoom = 3;
var centerArray = new Array(2);
centerArray[0] = 0;
centerArray[1] = 0;
view2DOptions.center = centerArray;
var bingMapsOptions = {};
bingMapsOptions.key = 'AqTGBsziZHIJYYxgivLBf0hVdrAk9mWO5cQcb8Yux8sW5M8c8opEC2lZqKR1ZZXf';
bingMapsOptions.imagerySet = 'Road';
var tileOptions = {};
tileOptions.source = new ol.source.BingMaps(bingMapsOptions);
var openLayersOptions = {};
openLayersOptions.view = new ol.View2D(view2DOptions);
openLayersOptions.layers = [new ol.layer.Tile(tileOptions)];
this._olMap = new ol.Map(openLayersOptions);

this._olMap.setTarget('map');