如何将Turf.js squareGrid图层添加到mapbox gl？

Question

我是新手，并尝试使用Mapbox GL添加网格层。希望能有所帮助。

var bbox = [-95, 30 ,-85, 40];
var cellSide = 50;
var options = {units: 'miles'};

var squareGrid = turf.squareGrid(bbox, cellSide, options);

Answer 1

到目前为止，您所拥有的为您提供了一个GeoJSON对象，您可以将其添加到地图中。假设您已经创建了一个地图（在getting started example之后），现在需要添加一个GeoJSON源，然后添加一个呈现它的图层。

类似

map.on('load', function() {
    map.addSource({
        'id': 'grid',
        'data': squareGrid
    });
    map.addLayer({
        'id': 'grid',
        'type': 'line',
        'source': 'grid,
        'paint': {
            'line-color': 'red',
        }
    });
});