Skip to content

天地图

Introduction

L7 geographical visualization focuses on the visual expression of geographical data. The map layer needs to rely on third-party maps. Third-party maps are created and managed uniformly through Scene. You only need to pass in map configuration items through Scene.

L7 internally resolves the differences between different map basemaps, and at the same time, L7 manages the operation methods of the map in a unified manner.

Apply for token

Tianditu JavaScript API 4.0 supports HTTP and HTTPS, is free and open to the public, and can be used directly. Before using the API, you need to apply for application key.

import

import { TdtMap } from '@antv/l7-maps';

Usage

import { Scene } from '@antv/l7';
import { TdtMap } from '@antv/l7-maps';

const scene = new Scene({
  id: 'map',
  map: new TdtMap({
    token: 'your-tianditu-token',
    center: [120, 30],
    zoom: 10,
  }),
});

scene.on('loaded', () => {
  // Add layers
});

Options

Name Description Type Default
token Tianditu API Key string Built-in test token (replace in production)
center Initial map center coordinates [number, number] [121.30654, 31.25744]
zoom Initial zoom level number 3
minZoom Minimum zoom level number 1
maxZoom Maximum zoom level number 18
mapInstance Pass in an existing Tianditu map instance T.Map -

options

zoom initialize zoom level

number

Initial map display level {number} Mapbox (0-24) AMap (2-19)

center map center

Map initial center latitude and longitude {Lnglat}

pitch map tilt angle

Map initial pitch angle {number} default 0

minZoom minimum zoom level

Minimum map zoom level {number} default 0 Mapbox 0-24) Gaode (2-19)

maxZoom maximum zoom level

Maximum map zoom level {number} default 22 Mapbox (0-24) AMap (2-19)

rotateEnable whether to allow rotation

Whether the map can be rotated {Boolean} default true

map events

Scene unified agent, seeScene document

or

scene.map directly calls the map instance method

© Copyright 2026 Ant Group Co., Ltd..备案号:京ICP备15032932号-38
Site search
Documentation and examplesType to start searching

Search documentation, APIs, and examples

↑↓Select↵OpenEscClose