OpenLayers Plugin

Getting Started

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

OpenLayers Version Support The ALK Maps plugin is tested with version 4.6.4 of OpenLayers. Support for other versions of OpenLayers cannot be guaranteed.

<script src="https://maps.alk.com/api/1.3/ol.js"></script>
<script src="https://maps.alk.com/api/1.3/alkmaps.js"></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>
  #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