Aeris Interactive Maps

Our Aeris Interactive Maps service allows you to create interactive maps with any mapping framework, such as Open Street Maps, Mapbox and Google Maps. This interactive map SDK allows users to choose which information is displayed and to click and drag the map, moving the location. In order to create an interactive map using our service, there are a number of steps you will need to follow. Below, you will find a sample of a basic map.

 

Getting Started

You'll need an active Aeris API subscription and your application registered with the API in order to receive the required access ID and secret key. For more details about using our Aeris Interactive Maps, review our Getting Started information.

Basic Use

The example below contains all of the code necessary to create your own webpage containing an Aeris Interactive Map.

HTML w/ Javascript

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>

    <style>
        #map-canvas { width: 600px; height: 600px;}
    </style>
</head>
<body>
<div id="map-canvas"></div>


<link href="//cdn.aerisjs.com/aeris-interactive/assets/css/default/style.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.2/leaflet.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/leaflet.markercluster/0.4.0/MarkerCluster.css" rel="stylesheet" />

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.2/leaflet.js"></script>
<script type="text/javascript" src="//cdn.aerisjs.com/aeris-interactive/aim-leaflet.js"></script>

<script type="text/javascript">
    var aerisMapBuilder = new aeris.interactive.MapAppBuilder({
        apiId: 'clientID',
        apiSecret: 'clientSecret',
        el: '#map-canvas'
    });
    aerisMapBuilder.start();
</script>



</body>
</html>