电脑做网站用什么软件,北京高端网站建设价格,网盘做网站,碳晶板全屋装修的利和弊需求#xff1a;
第三方的mapbox js api加载arcgis切片服务#xff0c;同时叠加在天地图上#xff0c;天地图坐标系web墨卡托。
效果图#xff1a;
形如这种地址去加载http://zjq2022.gis.com:8080/demo/loadmapboxtdt.html 思路#xff1a;
需要制作一个和天地图比例…需求
第三方的mapbox js api加载arcgis切片服务同时叠加在天地图上天地图坐标系web墨卡托。
效果图
形如这种地址去加载http://zjq2022.gis.com:8080/demo/loadmapboxtdt.html 思路
需要制作一个和天地图比例尺级别以及切片大小等一样的切片方案可以通过arcmap或者arcgispro制作。如图
具体的切片信息参数参考链接
arcgis javascript api4.x加载天地图web墨卡托wkid3857坐标系_acrgis 加载墨卡托地图-CSDN博客 制作出的切片方案见链接
链接https://pan.baidu.com/s/1fezUPJnp-G0g6cpcbsOuEw 提取码gfwm 使用该切片方案去切片。
切片之后的效果 mapbox加载arcgis切片服务示例代码
!DOCTYPE html
htmlheadmeta charsetutf-8 /titlemapbox 添加arcgis rest切片地图服务/titlemetanameviewportcontentinitial-scale1,maximum-scale1,user-scalableno/script srchttps://api.mapbox.com/mapbox-gl-js/v2.15.0/mapbox-gl.js/scriptlinkhrefhttps://api.mapbox.com/mapbox-gl-js/v2.15.0/mapbox-gl.cssrelstylesheet/script srchttps://cdn.bootcdn.net/ajax/libs/axios/0.19.2/axios.js/scriptstylebody {margin: 0;padding: 0;}#map {position: absolute;top: 0;bottom: 0;width: 100%;}/style/headbodydiv idmap/divscriptconst vecUrl http://t0.tianditu.com/vec_w/wmts?tk317e52a409b6b382957e09003ee7e235;const cvaUrl http://t0.tianditu.com/cva_w/wmts?tk317e52a409b6b382957e09003ee7e235;var tdtVec {type: raster,tiles: [vecUrl SERVICEWMTSREQUESTGetTileVERSION1.0.0LAYERvecSTYLEdefaultTILEMATRIXSETwTILEMATRIX{z}TILEROW{y}TILECOL{x}FORMATtiles,],tileSize: 256,};var tdtCva {type: raster,tiles: [cvaUrl SERVICEWMTSREQUESTGetTileVERSION1.0.0LAYERcvaSTYLEdefaultTILEMATRIXSETwTILEMATRIX{z}TILEROW{y}TILECOL{x}FORMATtiles,],tileSize: 256,};mapboxgl.accessToken pk.eyJ1IjoibHh0aWFudGlhbiIsImEiOiJjaXd2ZjlkYnQwMTZvMnRtYWZnM2lpbHFvIn0.ef3rFZTr9psmLWahrqap2A;var map new mapboxgl.Map({container: map, // container idcenter: [114.32021, 30.578322], // starting positionstyle: {version: 8,glyphs: mapbox://fonts/mapbox/{fontstack}/{range}.pbf,sources: {tdtVec: tdtVec,tdtCva: tdtCva,},layers: [{id: tdtVec,type: raster,source: tdtVec,},{id: tdtCva,type: raster,source: tdtCva,},],},zoom: 12, // starting zoomminZoom: 1,maxZoom: 18,});map.on(load, function () {map.addSource(arcgissource, {type: raster,tiles: [https://ncportal.geoscene.cn/server/rest/services/wuhan3857/MapServer/tile/{z}/{y}/{x},],tileSize: 256,});map.addLayer({id: tdt-img-tiles,type: raster,minzoom: 0,maxzoom: 19,source: arcgissource,});});// // 添加argis rest 动态地图服务// map.on(load, function () {// map.addSource(city-source, {// type: raster,// tiles: [// https://whgeoscene.hygt.com/server/rest/services/全国道路/MapServer/export?dpi96transparenttrueformatpng8layersbbox{bbox-epsg-3857}fimagebboxSR102100imageSR102100,// ],// // tiles:[http://localhost:6080/arcgis/rest/services/MyMapService/MapServer/export?dpi96transparenttrueformatpng8layersbbox{bbox-epsg-3857}fimagebboxSR3857imageSR3857],// // tiles: [http://221.239.0.144:6080/arcgis/rest/services/oceanname_vector/MapServer/export?bbox{bbox-epsg-3857}fimagetransparenttrueformatpng8bboxSR102100imageSR102100],// tileSize: 256,// });// map.addLayer({// id: sity-layer,// type: raster,// source: city-source,// });// });/script/body
/html参考资料
Sources | Mapbox Style Spec | Mapbox
