MapTalks.js 使用小结(二)
MapTalks.js 地图框架
官网地址:https://maptalks.org/
API地址:https://maptalks.org/maptalks.js/api/0.x/Map.html
一、鼠标指针事件
this.map.setCursor('url(../../static/draw.png) 4 12, auto'); this.map.resetCursor();
二、地方坐标系地图加载的方法(使用和了解 proj4)
参考地址:https://www.bbsmax.com/A/pRdB1k25nx/
//2385坐标系参数制定,包括地球椭球体,中央经线,偏移量等 var proj2385 = '+proj=tmerc +lat_0=0 +lon_0=120 +k=1 +x_0=500000 +y_0=0 +a=6378140 +b=6356755.288157528 +units=m +no_defs'; const proj = proj4('WGS84', proj2385); // 坐标转换方法 const projection = { code : '2385', // code of the projection project : function (c) { // from wgs84 to EPSG3857 var pc = proj.forward(c.toArray()); return new maptalks.Coordinate(pc); }, unproject : function (pc) { // from EPSG3857 to wgs84 var c = proj.inverse(pc.toArray()); return new maptalks.Coordinate(c); } }; this.map = new maptalks.Map('map', { center: config.MapConfig.center, zoom: config.MapConfig.zoom, minZoom: config.MapConfig.minZoom, maxZoom: config.MapConfig.maxZoom, maxExtent:new maptalks.Extent(119,31.5,119.5,32.5), attribution:false, //spatial reference definition spatialReference : { projection : projection, // geo projection, defined by proj4js resolutions : config.MapConfig.resolutions, fullExtent : config.MapConfig.fullExtent }, baseLayer : new maptalks.TileLayer('map',{ renderer:'canvas', urlTemplate: config.MapServices.BaseLayerUrl.NJMAP_DT, tileSystem: config.MapConfig.tileSystem, repeatWorld:false }), layers:[ new maptalks.TileLayer('map_zj',{ renderer:'canvas', urlTemplate: config.MapServices.BaseLayerUrl.NJMAP_ZJ, tileSystem: config.MapConfig.tileSystem, repeatWorld:false }) ] });
const MapConfig = { center: [119.3, 32.08], zoom: 13, minZoom: 10, maxZoom: 16, resolutions: [200000, 100000, 50000, 25000, 12500, 6250, 3125, 1562.5, 781.25, 390.625, 195.3125, 97.65625, 48.828125, 24.4140625, 12.20703125, 6.103515625, 3.0517578125, 1.52587890625, 0.762939453125, 0.3814697265625 ], fullExtent: { // map's full extent 'top': 250000, 'left': 80000, 'bottom': 50000, 'right': 190000 }, tileSystem: [1, -1, 80000.0, 250000.0] };