SOURCE

console 命令行工具 X clear

                    
>
console
mapboxgl.accessToken = 'pk.eyJ1IjoibW9ob25nIiwiYSI6ImNrNGFsdjY5ZzA1NW4zbG14b2JoMnA5c3IifQ.1qVWFsyHW2wKThTgQg08SA';

const styleObj = {
        version: 8,
        name: "chaotu",
        sprite: "mapbox://sprites/mapbox/streets-v8",
        glyphs: "mapbox://fonts/mapbox/{fontstack}/{range}.pbf",
        sources: {
          'raster-tiles': {
            type: 'raster',
            tiles: [
              // 从官网demo上找到的地址,可以正常加载
              'https://iserver.supermap.io/iserver/services/map-china400/rest/maps/China/zxyTileImage.png?z={z}&x={x}&y={y}'
              
              // 根据服务地址拼接的地址,无法加载
              // 'https://2.142.195.227:30867/iserver/services/map-World/rest/maps/World_Image/zxyTileImage.png?z={z}&x={x}&y={y}'
            ],
            tileSize: 256
          }
        },
        layers: [
          {
            "id": "simple-tiles",
            "type": "raster",
            "source": "raster-tiles",
            "minzoom": 0,
            "maxzoom": 22
          }
        ]
      }

const map = new mapboxgl.Map({
    container: 'map',
    style: styleObj,
    center: [116.39123296750768, 39.907180309385694],
    zoom: 10
});
<div id='map'></div>
html,body {
    padding: 0;
    margin: 0;
    height: 100%;
}
#map {
    width: 100%;
    height: 100%;
}

本项目引用的自定义外部资源