Getting Started

This documentation outlines the structure and features of the ALK Maps plugin for the OpenLayers API.

<script src="http://maps.alk.com/api/1.3/ol.js" type="text/javascript"></script>
<script src="http://maps.alk.com/api/1.3/alkmaps.js" type="text/javascript"></script>

You will also need to add a div element for the map. The id of this element will be used when you define your map.

<div id="map"></div>

Make sure to define the height of the map element as well.

<style type="text/css">
    #map { 
      width: 100%;
      height: 500px;
    }
</style>

The API Key

In order for the toolkit to work properly, you declare a variable containing your API key before calling any objects in the toolkit.

alk.defaults.setApiKey('YOUR_KEY_HERE');

The Map

Before we can move onto any of the plugin's features you will need to create the map object.

var map = new ol.Map({
  target: 'map',
  layers: [new alk.layer.MapLayer()]
  view: new ol.View({
    center: ol.proj.transform([51.505, -0.09], alk.val.SRS.EPSG4326, alk.val.SRS.EPSG3857),
    zoom: 13
  })
});

A Basic Map

Here is an example of a basic map and the code used to create it.

For further documentation on how to use OpenLayers and its features, please visit the OpenLayers website