SOURCE

console 命令行工具 X clear

                    
>
console
<html lang="en">

<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
	<title>Custom TileLayer</title>
	<link rel="stylesheet" href="//js.arcgis.com/4.28/esri/themes/light/main.css" />

	<style>
		html,
		body,
		#viewDiv {
			padding: 0;
			margin: 0;
			height: 100%;
			width: 100%;
		}
	</style>

	<script src="//js.arcgis.com/4.28/">
	</script>

	<script>
		require([
        "esri/Map",
        "esri/request",
        "esri/Color",
        "esri/views/MapView",
        "esri/widgets/LayerList",
        "esri/widgets/Expand",
        "esri/layers/BaseTileLayer",
        "esri/core/reactiveUtils"
      ], (Map, esriRequest, Color, MapView, LayerList, Expand, BaseTileLayer, reactiveUtils) => {

        function formatNumberLength (num, radix = 10, length = 0) {
            let str = num.toString(radix)
            if (length === 0) {
                return str
            }
            while (str.length < length) {
                str = '0' + str
            }
            return str
        }
        
        const TintLayer = BaseTileLayer.createSubclass({
          properties: {
            urlTemplate: null,
            tileInfo: null,
          },

          getTileUrl: function (level, row, col) {
            console.log('t', level, row, col)
            return this.urlTemplate.replace("{z}", "L" + formatNumberLength(level, 10, 2))
            .replace("{x}", "C" + formatNumberLength(col, 16, 8))
            .replace("{y}", "R" + formatNumberLength(row, 16, 8));
          }
        });

        const openTopoMapTileLayer = new TintLayer({
          urlTemplate: "http://localhost:8888/EarthG11/图层/_alllayers/{z}/{y}/{x}.jpg",
          tileInfo: {
                "rows": 256,
                "cols": 256,
                "dpi": 96,
                "format": "MIXED",
                "compressionQuality": 75,
                "origin": {
                    "x": -180,
                    "y": 90
                },
                "spatialReference": {
                    "wkid": 4490,
                    "latestWkid": 4490
                },
                "lods": [{
                    "level": 0,
                    "resolution": 0.7039130078552128,
                    "scale": 295828763.7958547
                },
                {
                    "level": 1,
                    "resolution": 0.3519565039276064,
                    "scale": 147914381.89792734
                },
                {
                    "level": 2,
                    "resolution": 0.1759782519638032,
                    "scale": 73957190.94896367
                },
                {
                    "level": 3,
                    "resolution": 0.0879891259819016,
                    "scale": 36978595.474481836
                },
                {
                    "level": 4,
                    "resolution": 0.0439945629909508,
                    "scale": 18489297.737240918
                },
                {
                    "level": 5,
                    "resolution": 0.0219972814954754,
                    "scale": 9244648.868620459
                },
                {
                    "level": 6,
                    "resolution": 0.0109986407477377,
                    "scale": 4622324.4343102295
                },
                {
                    "level": 7,
                    "resolution": 0.00549932037386885,
                    "scale": 2311162.2171551147
                },
                {
                    "level": 8,
                    "resolution": 0.002749660186934425,
                    "scale": 1155581.1085775574
                }]
            },
        });

        // add the new instance of the custom tile layer the map
        const map = new Map({
          layers: [openTopoMapTileLayer]
        });

        // create a new scene view and add the map
        const view = new MapView({
          container: "viewDiv",
          map: map,
          center: [106, 27],
          zoom: 5
        });
      });
	</script>
</head>

<body>
	<div id="viewDiv"></div>
</body>

</html>