mapboxノート

1690 ワード

1:mapboxレイヤープロパティの変更
map.setPaintProperty(layer, 'fill-opacity', 1);

2:mapboxレイヤーデータソースの変更
map.getSource(source).setData(cityHeatDatas);

3:mapbox現在の地図に追加されているレイヤーlayersとデータソースsourcesを取得
const layers = map.getStyle().layers;
const sources= map.getStyle().sources;

4:mapbox熱力図heat-weight式を追加
"heatmap-weight": ["/", ["get", "value"], heatWeight],

5:mapbox styleの変更
let style =  {
        "version": 8,
        "sources": {
            "raster-tiles": {
                "type": "raster",
                "tiles": ['https://t{s}.tianditu.gov.cn/DataServer?T=' + type + '_w&x={x}&y={y}&l={z}&tk=' + tk ],
                "tileSize": 256,
            }
        },
        "layers": [{
            "id": "tdt-img-tiles",
            "type": "raster",
            "source": "raster-tiles",
            "minzoom": 0,
            "maxzoom": 22
        }]
    };

map.setStyle(style);

6:マップロード完了後に実行
window.map.on('load', function() {
    console.log("do something!");    
});

7:あるレイヤーが存在するかどうかを判断する
const layer = map.getLayer("layerId");

8:レイヤーまたはデータソースの削除
map.removeLayer(layerId);   //  

map.removeSource(sourceId);    //  

9:範囲による位置決め(アニメーション含む)
const bounds = [78.23,27.05,99.25,36.30];
map.fitBounds(bounds);