# @tomtom-international/web-sdk-maps

> TomTom Maps SDK for Web - Maps library

Latest version **6.25.0** (published 2023-09-19) · SEE LICENSE IN LICENSE.txt license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install @tomtom-international/web-sdk-maps
pnpm add @tomtom-international/web-sdk-maps
yarn add @tomtom-international/web-sdk-maps
bun add @tomtom-international/web-sdk-maps
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 6.25.0 |
| Published | 2023-09-19 |
| First published | 2019-09-06 |
| Weekly downloads | 0 |
| License | SEE LICENSE IN LICENSE.txt |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 8 |
| Unpacked size | 7.9 MB |
| Known vulnerabilities | 0 (+4 in 2 direct dependencies) |
| Install scripts | no |
| Author | TomTom |
| Maintainers | rijnb, brozak, bottleofrum, tt-js, zmatysek, marquese, tt-jssdk |
| Keywords | tomtom, maps, routing, geocoding, search, navigation, traffic |

## Links

- npm: https://www.npmjs.com/package/@tomtom-international/web-sdk-maps
- Homepage: https://developer.tomtom.com/maps-sdk-web-js
- npm.io page: https://npm.io/package/@tomtom-international/web-sdk-maps

## Dependencies (8)

- [uuid](https://npm.io/package/uuid.md) 3.3.3
- [lodash](https://npm.io/package/lodash.md) 4.17.21
- [core-js](https://npm.io/package/core-js.md) 3.6.2
- [mapbox-gl](https://npm.io/package/mapbox-gl.md) 1.13.2
- [node-fetch](https://npm.io/package/node-fetch.md) 2.6.7
- [@types/mapbox-gl](https://npm.io/package/@types/mapbox-gl.md) 1.12.8
- [regenerator-runtime](https://npm.io/package/regenerator-runtime.md) 0.12.1
- [@mapbox/mapbox-gl-rtl-text](https://npm.io/package/@mapbox/mapbox-gl-rtl-text.md) 0.2.3

## Alternatives

- [express-promise-router](https://npm.io/package/express-promise-router.md) — 736.1K weekly downloads
- [next-usequerystate](https://npm.io/package/next-usequerystate.md) — 29.8K weekly downloads
- [@bitkyc08/opencodex](https://npm.io/package/@bitkyc08/opencodex.md) — 4.6K weekly downloads
- [lynkr](https://npm.io/package/lynkr.md) — 575 weekly downloads
- [baremetal.js](https://npm.io/package/baremetal.js.md) — 42 weekly downloads

## Recent versions

- 6.25.0 (latest) — 2023-09-19
- 5.69.1 (version5) — 2021-02-01
- 6.1.2-public-preview.24 (next) — 2021-01-04
- 6.23.0 — 2023-01-19
- 6.22.1 — 2022-12-28
- 6.21.3 — 2022-11-05
- 6.20.0 — 2022-06-24
- 6.19.1 — 2022-06-10
- 6.19.0 — 2022-05-13
- 6.18.0 — 2022-02-02
- 6.17.0 — 2022-02-01
- 6.15.0 — 2021-08-03
- 6.14.0 — 2021-06-25
- 6.13.0 — 2021-05-05
- 6.12.0 — 2021-04-02
- … 59 more at https://npm.io/package/@tomtom-international/web-sdk-maps/versions

## README

# Maps SDK for Web - Maps library

---
**NOTE**: New version available: V6 - Check the [release notes](https://developer.tomtom.com/maps-sdk-web-js/release-notes) to see what's new

---

## Documentation

Please, refer to pages for [Maps SDK for Web](https://developer.tomtom.com/maps-sdk-web-js) in the TomTom Developer Portal for detailed documentation with examples.

In this section you will also find the latest version of this SDK.

## Package content

The package contains the following files:

- `maps-web.min.js` - Library prepared to be included direcly in your HTML file.
- `maps-web.min.js.map` - Source map for the SDK build file.
- `maps.min.js` - Library in [UMD format](https://github.com/umdjs/umd). The code is minified and does not need any external dependencies.
- `maps.min.js.map` - Source map for the SDK build file.
- `maps.css` - Cascading Style Sheet needed by the library. It must be included in your webpage in order to render the expected map.
- `LICENSE.txt` - License file.
- `README.md` -  All foundation information about the SDK.

## Getting started

### Using module bundlers

If you use Webpack or other module bundler which supports ES6 import/export syntax, importing the library is simple:

```javascript
    import tt from '@tomtom-international/web-sdk-maps';

    const map = tt.map({
        key: '<your maps api key>',
        container: 'map'
    });
```

**Note that you also need to attach the `maps.css`** file in order to display the map correctly.
This can be done in multiple ways:
- if you use Webpack with postcss-loader and css-loader (or similar), add `@import "@tomtom-international/web-sdk-maps";`
in one of your stylesheets.
- copy `node_modules/@tomtom-international/web-sdk-maps/dist/maps.css` and include it into your project manually.

### Using a script tag

You can include the library directly in the HTML using a script tag.

```html
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="maps.css"/>
        <script src="maps-web.min.js"></script>
    </head>
    <body style="width: 100%; height: 100%; margin: 0; padding: 0;">
        <div id="map" style="width: 100%; height: 100%;"></div>
        <script>
            const map = tt.map({
                key: "<your maps api key>",
                container: "map"
            });
        </script>
    </body>
</html>
```

Please note that you need to have a valid **API Key** which can be obtained at the [TomTom Developer Portal](https://developer.tomtom.com/how-to-get-tomtom-api-key).

---
_Source: https://npm.io/package/@tomtom-international/web-sdk-maps · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._