最近接到个需求，客户想在切片底图放大到200:1时候还能看到道路的走向，我们了解，目前主流的几类底图，如谷歌、百度、高德、天地图等最大的比例尺是 1000:1左右，如果再往下切片，会占用很大的存储空间。结合实际情况，以当前我们本地环境发布的某省的街道切片地图为例，最大比例尺为1000，大约占了1T的存储空间，如果要切到最大比例尺为200，没有几十上百T的存储空间是放不下的，而且切图生成缓存的时间非常非常长，此方法不切实际，不推荐使用。
转换下思路，当切片底图缩放到最大比例尺后，再缩放的话就以要素图层来替代没有切片缓存的底图，实现方法如下：
一、以当前发布切片地图的矢量数据再发一个切片服务，在最大比例尺1000后加上500和200的比例尺，这样最大比例尺就变为了200。 切片缓存1000比例尺及之前的切片缓存就用原来发布的切片服务的缓存就可以(发布服务后，将原来的切片缓存导入即可)，后两级500和200的切片留空。
二、 从原来的切片服务配图工程里获取所需的矢量数据,本需求是行政区划分(面数据)和道路数据,然后根据之前的配图工程(mxd文件)，尽量保持配图的颜色和样式一致(这样切换地图的时候会平滑一点)，然后发布要素服务。
三 、界面呈现的时候，监听地图缩放时当前的层级，当层级超过比例尺1000的层级时，隐藏切片底图，显示要素图层。
测试代码，本人惯例，复制可直接打开：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>arcgis api 突破地图最大比例尺显示</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
<style>
body,
html {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
font-family: Arial;
}
#map {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
border: 0px dashed black;
background-color: rgb(0, 38, 48);
}
</style>
</head>
<body>
<div id="map">
</div>
</body>
<script src="https://js.arcgis.com/3.20"></script>
<script type="text/javascript">
require([
"esri/map",
"esri/layers/ArcGISTiledMapServiceLayer",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/geometry/Extent",
"dojo/domReady!"
], function(
Map,
ArcGISTiledMapServiceLayer,
ArcGISDynamicMapServiceLayer,
Extent
) {
//地图范围
var mapExtent = new Extent({
xmax: 113.799760210539,
xmin: 106.57095767482662,
ymax: 20.459116202966324,
ymin: 18.27952992162579,
spatialReference: {
wkid: 4326
}
})
map = new Map("map", {
extent: mapExtent,
sliderStyle: "small",
logo: false
});
map.on('load', function () {
map.hideZoomSlider()
map.hidePanArrows()
map.disableDoubleClickZoom() //禁用双击缩放
})
//arcgis 在线切片底图
var myTileLayer1 = new ArcGISTiledMapServiceLayer("http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer",{
visible: true
});
map.addLayer(myTileLayer1)
//arcgis 在线切片蓝色底图
//为了测试方便，用了两个切片底图作为测试，实际这里应该用ArcGISDynamicMapServiceLayer图层
var myTileLayer2 = new ArcGISTiledMapServiceLayer("http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer",{
visible: false
});
map.addLayer(myTileLayer2)
map.on("update-end",function(){//监听地图缩放
console.log("当前地图层级：" + map.getLevel())
if (map.getLevel()>8) { //假设切片底图的最大比例尺为8，当缩放等级大于8后，切换显示要素图层ArcGISDynamicMapServiceLayer
myTileLayer1.setVisibility(false)
myTileLayer2.setVisibility(true)
}
else {
myTileLayer1.setVisibility(true)
myTileLayer2.setVisibility(false)
}
})
});
</script>
</html>
测试效果：
