如何使用mapboxgl.js将切片图层添加到地图中

时间:2016-12-01 12:26:34

标签: javascript leaflet mapbox mapbox-gl mapbox-gl-js

这里添加使用tiff创建的图块

mapboxgl.accessToken ='pk.eyJ1IjoiZ2F1cmF2Y2F0c3RlY2giLCJhIjoiY2l1cGo0MTl4MDAxajJ1bng5a2xieTY0diJ9.0fDXNulI91U85ngSc4jGCg';
var map = new mapboxgl.Map({
  container: 'map',
  style: 'mapbox://styles/mapbox/light-v9',
  zoom: 13,
  center: [-122.447303, 37.753574]
});

map.on('load', function () {
  map.addSource('terrain-data', {
    type: 'raster',
    url:'mapbox://gaurav.2on6cgzq'
  });
  map.addLayer({
    "id": "terrain-data",
    "type": "line",
    "source": "terrain-data",
    "source-layer": "contour",
    "layout": {
      "line-join": "round",
      "line-cap": "round"
    },
    "paint": {
      "line-color": "#ff69b4",
      "line-width": 1
    }
  });
});

我得到了:

  

错误:源图层"轮廓"在源"地形数据"上不存在   由style layer" terrain-data"

指定

1 个答案:

答案 0 :(得分:2)

我不相信"source-layer": "contour"适用于任何光栅源。请参阅https://www.mapbox.com/mapbox-gl-js/example/map-tiles/所以摆脱那条线。看起来你需要在源头上包含"tileSize": 256选项。

此外,您的布局和绘画选项也将不再需要。这些是矢量或geojson源的选项。栅格上没有这些类型的控件。