arcgis for js 4.25 加载缓存服务
加载arcgis server 缓存服务（切片服务）
代码如下：<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
<title>加载缓存服务</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 800px;
width: 1600px;
overflow: hidden;
}
</style>
<link rel="stylesheet" href="http://localhost:8090/arcgis/4.25/esri/css/main.css" />
<script src="http://localhost:8090/arcgis/4.25/init.js"></script>
<script>
require(["esri/Map",
"esri/views/MapView",
"esri/layers/GraphicsLayer",
"esri/Graphic",
"esri/PopupTemplate",
"esri/widgets/Popup",
"esri/layers/MapImageLayer",
"esri/widgets/Legend",
"esri/layers/WebTileLayer",
"esri/layers/WMTSLayer",
"esri/layers/VectorTileLayer",
"esri/widgets/BasemapGallery/support/LocalBasemapsSource",
"esri/widgets/BasemapGallery",
"esri/Basemap",
"esri/layers/FeatureLayer",
"esri/geometry/Extent",
"esri/geometry/SpatialReference",
'esri/config',
'esri/layers/support/TileInfo',
"esri/layers/TileLayer",
], function(
Map,
MapView,
GraphicsLayer,
Graphic,
PopupTemplate,
Popup,
MapImageLayer,
Legend,
WebTileLayer,
WMTSLayer,
VectorTileLayer,
LocalBasemapsSource,
BasemapGallery,
Basemap,
FeatureLayer,
Extent,
SpatialReference,
esriConfig,
TileInfo,
TileLayer,
) {
let lods = [
{
"level": 0,
"resolution": 132.2919312505292,
"scale": 1500000
},
{
"level": 1,
"resolution": 66.1459656252646,
"scale": 250000
},
{
"level": 2,
"resolution": 33.0729828126323,
"scale": 125000
},
{
"level": 3,
"resolution": 16.933367200067735,
"scale": 64000
},
{
"level": 4,
"resolution": 8.466683600033868,
"scale": 32000
},
{
"level": 5,
"resolution": 4.233341800016934,
"scale": 16000
},
{
"level": 6,
"resolution": 2.116670900008467,
"scale": 8000
},
{
"level": 7,
"resolution": 1.0583354500042335,
"scale": 4000
},
{
"level": 8,
"resolution": 0.5291677250021167,
"scale": 2000
},
{
"level": 9,
"resolution": 0.26458386250105836,
"scale": 1000
},
{
"level": 10,
"resolution": 0.13229193125052918,
"scale": 500
},
{
"level": 11,
"resolution": 0.06614596562526459,
"scale": 250
},
{
"level": 12,
"resolution": 0.033072982812632296,
"scale": 125
}
]
const tileInfo = new TileInfo({
dpi: 96,
rows: 256,
cols: 256,
format: 'image/png',
compressionQuality: 0,
origin: {
x: -5123200,
y: 1.00021E7
},
// dpi: 90.71428571427429,
// rows: 256,
// cols: 256,
// format: 'image/png',
// compressionQuality: 0,
// origin: {
// x: -180,
// y: 90
// },
spatialReference: {
wkid: 4547
},
lods: lods
})
//4.25 加载缓存服务
let tileurl = "http://localhost:8090/111arc/arcgisserver12/rest/services/CS/2016LP_WG_YGA_0213_4000/MapServer"
let temptile = new TileLayer({url:tileurl})
let basemap = new Basemap({
// baseLayers: [tilelyr4,tilelyr]
baseLayers: [temptile]
})
var map = new Map({
basemap: basemap
});
var view = new MapView({
container: "viewDiv",
map: map,
spatialReference: {
wkid: 4547
},
// scale: tileInfo.lods[7],
// //center: [113.754645, 23.198923], //113.27434372047993,22.722786885699826
// linked: false,
// zoom: 1,
// center: point,
constraints: { //可控制设置view比例
lods: tileInfo.lods,
// minScale: tileInfo.lods[0].scale,
// maxScale: tileInfo.lods[8].scale
},
});
let textSymbol = {
type: "text",
text: "ceshi",
font: {
family: "Merriweather",
size: 12,
style: "italic",
weight: "bold"
}
};
let markerSymbol = {
type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
color: [226, 119, 40]
};
let gra = new Graphic({
geometry: point,
symbol: markerSymbol,
//symbol: textSymbol
})
// view.graphics.add(gra)
//可忽略extent
view.extent = new Extent({
xmin:466569.47560766095,
ymin:2493792.6508626956,
xmax:570061.0955524376,
ymax:2533644.0408610776,
spatialReference: {
wkid: 4547
}
});
view.on('click', function(e) {
console.log(e)
})
window.view = view
document.getElementById("findbtn").onclick = function(){
console.log(2222);
var layer2 = new MapImageLayer({
url: "http://localhost:8090/111arc/arcgisserver12/rest/services/CS/2018LP_WG_SZ0208/MapServer",
});
map.add(layer2)
}
});
</script>
</head>
<body class="calcite">
<button id='findbtn' style='position: absolute;top:20px;left:70px;z-index: 999;'>加载动态服务</button>
<div id="viewDiv"></div>
</body>
</html>
