0

有人可以提供代码示例以将 ArcGIS Map Service 使用到 MapBox GL API 中吗？谢谢！

4

2 回答 2

7 
<style>
    body {
        margin: 0;
        padding: 0;
    }

    #map1 {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 49%;
    }

    #map2 {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 51%;
        width: 49%;
    }

    #map1_label,
    #map2_label {
        padding: 0.5em;
        position: absolute;
        z-index: 1;
        top: 10;
        color: #FFF;
        font-size: 1.2em;
        background-color: rgba(0, 0, 0, 0.8)
    }

    #map1_label {
        left: 10;
    }

    #map2_label {
        left: 51%;
    }
</style>


<div id="map1_label">Dynamic Map Service</div>
<div id="map2_label">Cached Map Service</div>
<div id='map1'></div>
<div id='map2'></div>

<script>
    mapboxgl.accessToken = 'your-mapbox-api-key';
    var map1 = new mapboxgl.Map({
        container: 'map1',
        style: 'mapbox://styles/mapbox/streets-v10',
        center: [153.021072, -27.470125],
        zoom: 15
    });

    var map2 = new mapboxgl.Map({
        container: 'map2',
        style: 'mapbox://styles/mapbox/streets-v10',
        center: [153.021072, -27.470125],
        zoom: 15
    });

    map1.on('load', function() {
        map1.addLayer({
            "id": "dynamic-demo",
            "type": "raster",
            "minzoom": 0,
            "maxzoom": 22,
            "source": {
                "type": "raster",
                "tiles": ['https://services.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/export?dpi=96&transparent=true&format=png32&layers=show%3A0&bbox={bbox-epsg-3857}&bboxSR=EPSG:3857&imageSR=EPSG:3857&size=256,256&f=image'],
                "tileSize": 256
            }
        });
    });

    map2.on('load', function() {
        map2.addLayer({
            "id": "cache-demo",
            "type": "raster",
            "minzoom": 0,
            "maxzoom": 22,
            "source": {
                "type": "raster",
                "tiles": ['https://services.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'],
                "tileSize": 256
            }
        });
    });
</script>

于 2017-07-18T02:03:59.280 回答
-1

Mapbox GL 仅使用与 Mapbox Vector Tiles 规范 [1] 兼容的矢量切片。

如果 ArcGIS Map Service 提供兼容的矢量切片，您可能会创建一个样式，其中切片源指向您提到的服务 [2]。

[1] https://www.mapbox.com/vector-tiles/specification/

[2] https://www.mapbox.com/mapbox-gl-style-spec/#sources

于 2016-05-08T17:15:03.837 回答