MapGL Examples

The list below includes rough examples of using 2GIS MapGL API. You can find the source code of these examples in the GitHub repository.

More official examples with detailed descriptions can be found in the documentation on docs.2gis.com.

Common

Markers backend

Example with GeoJSON markers and a backend simulation that sends them to client

[demo] [source]

Color buildings

Example of using featureState to color buildings

[demo] [source]

GLTF-plugin

Example of adding an interactive realty scene to the map

[demo] [source]

GLTF-plugin Sakura

Example of adding an interactive realty scene to the map

[demo] [source]

Polygon drawing

Example of user polygon drawing

[demo] [source]

Raster overlay

And old paper map above the vector map

[demo] [source]

Simple

Simple example of map creating

[demo] [source]

Style changing

Applying a new style by interval

[demo] [source]

Clusters

Clustered markers with arcs

Clustered markers with arc geometry

[demo] [source]

Clustered markers with popups

Show a popup after a click on the marker

[demo] [source]

Huge clustering

Example of using a huge amount of markers with clustering

[demo] [source]

Directions API

Directions API floors

Using Directions API through floors plans

[demo] [source]

Directions API with obstacles

Using Directions API with obstacles

[demo] [source]

Basic directions search app

Using Directions API in basic directions search app

[demo] [source]

GeoJSON

GeoJSON data update

Changing data in GeoJSON source

[demo] [source]

Hover GeoJSON with Polygon

Hover GeoJSON data effect with additional Polygon object

[demo] [source]

Hover GeoJSON setData

Hover effect with GeoJSON source setData method

[demo] [source]

Dragging

GeoJSON point dragging

Example of GeoJSON draggable point

[demo] [source]

HTML marker drag

Example of HTML draggable marker

[demo] [source]

Marker drag

Example of WebGL draggable marker

[demo] [source]