TomTom LogoDocs
Products
Resources
Pricing
Sign in
Maps SDK for JavaScript
Introduction
Guides
Examples
API Reference

AI Coding with the SDK

VERSION 0.46.12PUBLIC PREVIEW

AI coding agents (Claude Code, Cursor, GitHub Copilot, Windsurf, and others) are powerful but work best when they understand the library you’re building with. The SDK ships a /tomtom-maps-sdk-js skill that gives your coding agent the right context — module patterns, coordinate conventions, service APIs, and common gotchas — so it can write accurate, idiomatic code on the first try.

What is a skill?

A skill is a compact, curated knowledge document that you install into your project once. When invoked, it loads SDK-specific guidance directly into the agent’s context window — no web search, no hallucinated APIs.

The tomtom-maps-sdk-js skill covers:

TopicWhat the agent learns
Map setupTomTomMap, modules, styles, MapLibre integration, layer/event patterns
Places & searchFuzzy search, geocoding, reverse geocoding, autocomplete, POI categories, geometry search, ViewportPlaces
RoutingcalculateRoute, waypoints, alternatives, guidance, EV routing, reachable ranges
TrafficFlow, incidents, area analytics
Core typesPlace, Route, typed properties, section types
Core utilitiesbboxFromGeoJSON, getPosition, formatDistance, formatDuration, route progress
Services configAPI key setup, language, request hooks, customizeService
MapLibre direct accessAdding sources/layers, paint/layout properties, querying features

Installing the skill

Run this once in your project root:

npx skills add tomtom-international/maps-sdk-js --skill tomtom-maps-sdk-js

This writes the skill files into .claude/skills/ (or the equivalent directory for your agent). Commit the result so the whole team benefits.

Invoking the skill

Trigger it in your agent with a topic:

/tomtom-maps-sdk-js map-setup
/tomtom-maps-sdk-js places
/tomtom-maps-sdk-js routing
/tomtom-maps-sdk-js traffic

For multi-topic tasks, name both:

/tomtom-maps-sdk-js places routing

The agent reads the relevant reference doc and answers in the context of your current code.

What to expect

With the skill active, the agent will:

  • Use the [longitude, latitude] coordinate order consistently (a common source of bugs)
  • await Module.get(map) before calling module methods, since all modules are async
  • Return geocode() when the result count is uncertain, and geocodeOne() when exactly one result is expected
  • Include complete HTML + CSS alongside TypeScript, since the map container requires explicit dimensions
  • Write idiomatic patterns from the SDK rather than inventing alternatives

Tips for best results

Describe what you want to display, not which API to call. The skill gives the agent enough context to choose the right service and module — you don’t need to specify them.

“Show a route from Amsterdam to Utrecht with a stop at a gas station, displaying traffic incidents along the way”

Mention the target environment when relevant. The Services bundle works in Node.js and React Native; the Map bundle is browser-only. Saying “this is a Node.js script” or “this is a React app” helps the agent pick the right imports.

Refer back to the skill if the agent drifts. In long sessions, re-invoke with a topic to reload the reference into context.

Related guides