MapBoxLayers

About

The MapboxVectorLayer allows you to create a layer based on a Mapbox-hosted style using a single vector source.

Setup

interface IMapBoxVectorLayerInfo extends IBaseLayerInfo {
    LayerType: "MapBoxVectorLayer";
    /** MapBox style url, e.g. mapbox://styles/mapbox/light-v10 */
    StyleUrl: URL;
    /** Map box access token, connects request to an active map box account */
    AccessToken: string;
}

interface IMapBoxElevationLayerInfo extends IBaseLayerInfo {
    LayerType: "MapBoxElevationLayer";
    /** Map box access token, connects request to an active map box account */
    AccessToken: string;
}

Example

include {Layers} from "@mariateleplan/map-core"
const elevationInfo: Layers.IMapBoxElevationLayerInfo =         {
            "Visible": false,
            "LayerType": "MapBoxElevationLayer",
            "Id": "elev_mb",
            "Name": "Mapbox elevation",
            "AccessToken": "YOUR_ACCESS_TOKEN",
            "ParentLayerId": "maps"
        }
const mapBoxVectorInfo: Layers.IMapBoxVectorLayerInfo = {
            "Visible": false,
            "LayerType": "MapBoxVectorLayer",
            "Id": "mapbox_light_v10",
            "Name": "Mapbox light",
            "StyleUrl": "mapbox://styles/mapbox/light-v10",
            "AccessToken": "YOUR_ACCESS_TOKEN",
            "ParentLayerId": "maps"
}

const layers: Layers.ILayersInfo = {
    Services:{},
    Layers:[new Layers.MapBoxElevationLayer(elevationInfo), new Layers.MapBoxVectorLayer(mapBoxVectorInfo)]
}
const props = {   
      "Zoom": 10,
      "Center": [1197567, 8380058],
      "Projection": 'EPSG:3857'
    }
const mapHtmlId = "map";
const maria = new MariaCore(props, mapHtmlId)
maria.SetupLayers(layers)