Skip to main content
Map properties define the state and configuration of your map instance. You can get and set these properties using the corresponding getter and setter methods.

Common Properties

PropertyTypeDescription
centerArray[longitude, latitude] of the map center
zoomNumberCurrent zoom level
bearingNumberMap rotation in degrees
pitchNumberMap tilt in degrees
styleString/ObjectURL or object for the map style
projectionString/ObjectCurrent map projection
terrainObjectTerrain configuration (if enabled)
loadedBooleanWhether the map is fully loaded
maxZoomNumberMaximum allowed zoom level
minZoomNumberMinimum allowed zoom level
maxBoundsArrayMap bounds [[west, south], [east, north]]
interactiveBooleanWhether user interaction is enabled
containerHTMLElementThe DOM element for rendering the map

Getters and Setters

// Get current center
const center = map.getCenter();

// Set new center
map.setCenter([105.85, 21.03]);

// Get and set zoom
const zoom = map.getZoom();
map.setZoom(12);

// Get and set bearing
const bearing = map.getBearing();
map.setBearing(45);

// Get and set pitch
const pitch = map.getPitch();
map.setPitch(60);

// Get and set style
const style = map.getStyle();
map.setStyle('https://3dmapfi.xyz/styles/dark.json');

Advanced Properties

  • maxBounds: Restrict the map view to a given bounding box.
  • interactive: Enable or disable all user interaction.
  • loaded: Check if the map and all resources are fully loaded.
map.setMaxBounds([[100, 10], [110, 20]]);
map.setInteractive(false);
if (map.loaded()) {
  // Safe to perform operations
}

Property Events

Some properties trigger events when changed, such as move, zoom, rotate, and pitch.
map.on('move', () => {
  // Respond to map movement
});
See also: Map API