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