最近在使用superMap iclient for leaflet 构建自己的地图应用,
专题图制作时发现服务端专题图频繁使用会对服务器造成很大鸭梨，时常导致iserver崩溃。
方案1
采用客户端专题图
例： iclient.supermap.io/examples/le…
实现：需要从服务器查询数据再在浏览器绘制专题图
缺点：查询数据量大的话耗时长，传输慢，且占用浏览器大量内存。地图每次移动都需要重新计算渲染的几何，卡顿。
数据量小可以采用这种方式
方案2
数据量大的情况下采用服务端专题图
思路：
- 每次重启iserver会清除前端制作的专题图切片，可以iserver设置清除缓存的时常，最短为1天一次，也可设置一周
- 绘制专题图成功时能够拿到服务器端专题图切片的layerID，将layerID存在客户端浏览器内。
- 用户再次查看专题图时，先判断layerID是否存在于iserver对应的地图服务下。若存在，则直接使用该切片专题图，若不存在则执行步骤2制作新的切片专题图。
实现：
- 服务端专题图绘制可参考官方示例 iclient.supermap.io/examples/le…
- 前端缓存此处不赘述，可使用localstorage 我这里用了个localforage插件
- 这部分研究了官方服务的一些接口，取巧写了个方法，直接上代码
/**
* 判断专题图ID是否仍然有效
* @param layer 图层URL
* @param layerId 要判断的专题图ID
*/
ifThemeLayerIDAvailable(layer,layerId){
return new Promise((reslove,reject)=>{
if(layerId == null){
reject(false)
return
}
let checkUrl = layer + '.jsonp/tileImage.json?callback=callback&layersID='+layerId
$.ajax({
url: checkUrl,
type: "GET",
dataType: "json", //指定服务器返回的数据类型
jsonpCallback: "callback", //指定回调函数名称
success: function (data) {
reslove(true)
},
error: function(err){
reject(false)
}
});
})
}
总结：方案1可制作小数据量专题图，不会对iserver造成压力。方案2在大数据量专题图展示表现非常优秀，切片用着就是飞一般的感受，若服务器每天清除一次缓存，用户在次日就能看到当天修改的数据。（数据量这么大，估计也不会关心一天修改的边边角角吧...）
