@tomtom-international/web-sdk-plugin-pancontrols

Pan Plugin

A plugin that provides the ability to pan map using ui controls, for @tomtom-international/web-sdk-maps.

Please note that from version 2.0.0 this plugin only works with @tomtom-international/web-sdk-maps@6.*.*, if you are using @tomtom-international/web-sdk-maps@5.*.* please use version 1.*.*

Instalation

Just do:

npm i @tomtom-international/web-sdk-plugin-pancontrols

You must also include the pan control stylesheet in your project. It's located here:

node_modules/@tomtom-international/web-sdk-plugin-pancontrols/dist/PanControls.css

Usage

In this example we assume that you already have the Tomtom Maps SDK for Web library included.

import tt from '@tomtom-international/web-sdk-maps';
import PanControls from '@tomtom-international/web-sdk-plugin-pancontrols';

const ttPanControls = new PanControls({
    className: 'my-class-name', // default = ''
    panOffset: 150 // default = 100
});

const ttMap = tt.map({
    key: '<your-tomtom-maps-sdk-key>',
    container: 'map',
    center: [19.45773, 51.76217],
    zoom: 12
});

ttMap.addControl(ttPanControls, 'top-left');