• Optimization
  • Navigation
  • Tracking
  • Maps
  • Places

Map

A newer version of Maps for web SDK is available
A newer version of the SDK is available and is recommended for all users. Learn about the latest version, V2.0, in the Maps for web v2.0 documentation

Creates a map instance.

Parameters

NameDescription
centeroptional Defines the initial center of the map view. Example: { lat: 28.6139, lng: 77.209 }

Default: {lat: 28.5934, lng: 77.2223}
zoomoptional Defines the initial zoom level of the map view. Example: 12

Default: 12
themeoptional Defines the initial theme of the map view. Currently supported values are dark and light.

Default: 'light'
vectorTilesSourceUrloptional Defines the initial vector tiles source URL. You can use a third-party or your custom tiles service to render the map. Example: vectorTilesSourceUrl: 'https://example.com/your-source.json'

Default: NextBillion.ai Maps built-in tiles service

Methods

Set Theme

To switch a theme of a map instance.

setTheme(name: string)

Example

1
2
3
4
5
6
7
8
9
var map = new nextbillion.maps.Map(document.getElementById('map'), {
  zoom: 12,
  center: { lat: 28.6139, lng: 77.239 },
  theme: 'light',
  vectorTilesSourceUrl: 'https://example.com/your-source.json',
})

// To switch a theme
map.setTheme('dark')

Set Vector Tiles Source

To switch a vector tiles source of a map instance.

setSource(url: string)

Example

1
2
3
4
5
6
7
8
9
var map = new nextbillion.maps.Map(document.getElementById('map'), {
  zoom: 12,
  center: { lat: 28.6139, lng: 77.239 },
  theme: 'light',
  vectorTilesSourceUrl: 'https://example.com/your-source.json',
})

// To switch a vector tiles source
map.setSource('https://example.com/alternative-source.json')

Fly To

Move to a different location, zoom level, bearing or pitch with animated transition.

map.flyTo(options)

Example

1
2
3
4
5
6
7
8
9
10
11
var map = new nextbillion.maps.Map(document.getElementById('map'), {
  zoom: 12,
  center: { lat: 28.6139, lng: 77.239 },
})

map.flyTo({
  center: { lat: 36.0671, lng: 120.3826 },
  zoom: 16,
  speed: 1.5,
  curve: 0.8,
})