Map Tiles

AerisWeather Maps allows requesting images as map tiles for use with most interactive mapping platforms. The tiles are provided as 256x256 PNG images in the Spherical Mercator projection used by most mapping frameworks, including Google Maps, Apple Maps, Mapbox and Open Street Maps.

The URL format for each tile request will require the server number to use (from 1-4), tile type code, interval offset for the interval to return, map x and y (row and column) and zoom level. You will also have to include your application's API access id and key:

https://maps[server].aerisapi.com/[client_id]_[client_key]/[type]/[zoom]/[x]/[y]/[offset].png

In order to speed up web requests, we allow you to request tiles from 4 servers: maps1 through maps4. Therefore, you can randomize the value for [server] in your tile requests as long as it's a value from 1 to 4.

The following is an example tile request for the latest radar image at column 41, row 23 and for zoom level 8:

https://maps2.aerisapi.com/[client_id]_[client_key]/radar/8/41/23/current.png

Request Variables

The following variables are used when requesting overlay tiles:

server	(integer) The server to use for the request, from 1-4.
client_id	(string) The unique client id for your API account.
client_secret	(string) The unique client secret for your API account.
type	(string) The layer type code to request. Refer to the Layer Usage details and the Layer Types for a list of supported codes
zoom	(integer) The zoom level to use for the image. This is normally a value from 1 to 21 and corresponds to the standard zoom level of most popular third-party mapping libraries, such as Google Maps and Mapbox.
x	(integer) Tile column for the map, which depends on the zoom level.
y	(integer) Tile row for the map, which depends on the zoom level.
offset	(integer) The time offset for the image. Refer to the Time Offsets details for more information.

Example Interactive Map Usage via Leaflet

Looking for interactive maps? The AerisWeather Mapping Platform easily integrates with popular libraries such as Leaflet:

With the above example we create a map within the aerismap div tag, add an Open Street Maps (OSM) base map with the AerisWeather Mapping Platform Radar layer on top:

var map = L.map('aerismap').setView([44.96, -93.27], 5);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; OpenStreetMap contributors'
}).addTo(map);
L.tileLayer('https://maps.aerisapi.com/[client_id]_[client_key]/radar/{z}/{x}/{y}/current.png', {
    subdomains: '1234',
    attribution: '&copy;AerisWeather',
}).addTo(map);

Alternatively, an interactive map using the AerisWeather Mapping Platform layers for the base and overlays too:

var map = L.map('aerismap').setView([44.96, -93.27], 5);
L.tileLayer('https://maps.aerisapi.com/[client_id]_[client_key]/flat,radar,admin/{z}/{x}/{y}/current.png', {
    subdomains: '1234',
    attribution: '&copy;AerisWeather',
}).addTo(map);

Example Interactive Map Usage via Google Maps API

<script>
    var gmap;
    function initMap() {
        gmap = new google.maps.Map(document.getElementById('map'), {
            center: {lat: 44.96, lng: -93.27},
            zoom: 5
        });

        var radar = new google.maps.ImageMapType({
            getTileUrl: function(coord, zoom) {
                return ['https://maps.aerisapi.com/[client_id]_[client_key]/radar/',
                    zoom, '/', coord.x, '/', coord.y, '/current.png'].join('');
            },
            tileSize: new google.maps.Size(256, 256)
        });
        gmap.overlayMapTypes.push(radar);

    }
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_GOOGLE_API_KEY&callback=initMap"
        async defer></script>

Last modified: August 20, 2021