Sorry, you need to enable JavaScript to visit this website.

BUILD THE NEXT GENERATION OF LOCATION EXPERIENCES

Everything you need to build location based apps

 

FREE MAPS AND TRAFFIC FLOW TILES

with our Mobile Maps SDK for Android™ and iOS! Ready to put yourself and your business on the map?

Learn more

PUBLIC PREVIEW OF OUR NEW GEOFENCING API

Add Geofencing functionality to your application to take action based on the location of devices you are tracking. Try it out now and share your feedback.

Learn more
  • 19 TRILLION DATA POINTS

    COLLECTED BY TOMTOM

  • 11 BILLION NEW ONES

    ADDED EVERY DAY

  • INFINITE

    WAYS TO INNOVATE

19 TRILLION LOCATION DATA POINTS TO HELP YOU...

The TomTom Maps APIs allow you to easily build location-aware applications. A variety of cross platform REST APIs and SDKs are available to build and enhance your mobile and web apps with search, routing, mapping, traffic and navigation features.

  • Map tile

    DISPLAY

    The Maps API enables static and interactive maps to be displayed in any mobile and/or web application. TomTom real-time map making technology provides users with the most accurate and up-to-date maps.

    Learn More

  • Magnifier tile

    FIND

    The Search API enables geocoding and searching for an address or place. By using fuzzy matching algorithms and auto-completion, Search API provide an excellent query interface for interacting directly with end-users.

    Learn More

  • Route tile

    GUIDE

    The Routing API enables planning a route from A to B, considering both historical and real-time traffic conditions. Applications can provide users with highly accurate travel times and live updated travel information and route instructions.

    Learn More

  • Traffic tile

    TRAFFIC

    Traffic API is a suite of web services designed for developers to create web and mobile applications around real-time traffic, traffic jams and incidents around the road network. These web services can be used via RESTful APIs.

    Learn More

  • Geofencing tile

    GEOFENCING

    The Geofencing API enables developers to define virtual boundaries and check if their tracked assets are inside or outside of them. The Geofencing API is compatible with any type of devices and can be combined with the Search API to use geographical features as fences.

    Learn More

BUT WHAT CAN IT DO?

// Define your product name and version
tomtom.setProductInfo('TomTom Maps API Code Examples', '4.28.49');
var trafficFlowOptions = {
    key: '<your-tomtom-API-key>',
    style: 'relative'
};
var vectorTrafficFlowOptions = {
    key: '<your-tomtom-API-key>',
    refresh: 180000,
    basePath: 'https://api.tomtom.com/maps-sdk-js/4.28.49/examples/sdk',
    style: 'relative'
};
var map = tomtom.map('map', {
    key: '<your-tomtom-API-key>',
    source: ['raster', 'vector'],
    basePath: 'https://api.tomtom.com/maps-sdk-js/4.28.49/examples/sdk',
    vectorTrafficFlow: vectorTrafficFlowOptions,
    center: [51.50276, -0.12634],
    zoom: 15
});
var languageLabel = L.DomUtil.create('label');
languageLabel.innerHTML = 'Maps language';
var languageSelector = tomtom.languageSelector.getHtmlElement(tomtom.globalLocaleService, 'maps');
languageLabel.appendChild(languageSelector);
var languageWarning = L.DomUtil.create('label', 'warning');
languageWarning.innerHTML = 'Language selection is only possible for vector map tiles.';
tomtom.controlPanel({
    position: 'bottomright',
    title: 'Settings',
    collapsed: true,
    closeOnMapClick: false
})
    .addTo(map)
    .addContent(languageLabel)
    .addContent(languageWarning);
tomtom.controlPanel({
    position: 'topright',
    title: null,
    show: null,
    close: null,
    collapsed: false,
    closeOnMapClick: false
})
    .addTo(map)
    .addContent(document.getElementById('map').nextElementSibling);
function isFlowLayer(name) {
    return name.toLowerCase().indexOf('flow') >= 0;
}
function isVectorLayer(name) {
    return name.toLowerCase().indexOf('vector') >= 0;
}
function updateTrafficFlowStyle() {
    var selectedOption = this.value;
    vectorTrafficFlowOptions.style = selectedOption;
    trafficFlowOptions.style = selectedOption;
    map.eachLayer(function(layer) {
        if (!isFlowLayer(layer.name)) {
            return;
        }
        if (isVectorLayer(layer.name)) {
            layer.updateOptions({style: selectedOption});
        } else {
            layer.options.style = selectedOption;
            layer.redraw();
        }
    });
}
var trafficLayer = L.MapUtils.findLayersByName('vectorTrafficFlow', map)[0];
function updateBaseLayer() {
    map.setMapSource(this.value);
    if (this.value === 'vector') {
        languageLabel.classList.remove('disabled');
        languageSelector.disabled = false;
    } else if (this.value === 'raster') {
        languageLabel.classList.add('disabled');
        languageSelector.disabled = true;
    }
    if (trafficLayer) {
        trafficLayer.bringToFront();
    }
}
function createTrafficLayer(name) {
    switch (name) {
    case 'vectorTrafficFlow':
        return new L.TomTomVectorTrafficFlowLayer(vectorTrafficFlowOptions);
    case 'trafficFlow':
        return new L.TomTomTrafficFlowLayer(trafficFlowOptions);
    default:
        return null;
    }
}
function switchTraffic(event) {
    var layerName = event.target.value;
    map.removeLayer(trafficLayer);
    trafficLayer = createTrafficLayer(layerName);
    map.addLayer(trafficLayer);
    if (trafficLayer) {
        trafficLayer.bringToFront();
    }
}
document.getElementById('trafficStyle').onchange = updateTrafficFlowStyle;
document.getElementById('baseLayer').onchange = updateBaseLayer;
document.getElementById('trafficLayer').onchange = switchTraffic;
(function initializeTileSwitcher() {
    var baseLayerSelect = document.getElementById('baseLayer');
    var layers = map.getBaseLayers();
    function newOption(value, label, selected) {
        var option = document.createElement('option');
        option.value = value;
        option.text = label;
        if (selected) {
            option.selected = 'selected';
        }
        return option;
    }
    if (layers.raster) {
        baseLayerSelect.appendChild(newOption('raster', 'Raster'));
    }
    if (layers.vector) {
        baseLayerSelect.appendChild(newOption('vector', 'Vector', true));
    }
})();
Learn more

LOOKING FOR A SPECIFIC SOLUTION FOR YOUR USE CASE?

Check out our use case tutorials.

More examples

HAPPY TO HELP

The TomTom Maps APIs allow you to easily build location-aware applications. A variety of cross platform REST APIs and SDKs are available to build and enhance your mobile and web apps with search, routing, mapping, traffic and navigation features.