更新 'mayfinal.js'

增加坐标正反算

mayfinal.js

@@ -82,6 +82,34 @@ function viewport2mplat(vx, vy) {
     return { x: mx, y: my };
 }
 
+function viewport2wgs84(vx, vy) {
+    const mlc = viewport2mplat(vx, vy);
+    //数据超界处理, 这里对应缩放等级的地图的大小是
+    const limit = calTileSize() * Math.pow(2, zoom_level);
+    console.log(calTileSize());
+    if (vx <= 0 || vy <= 0 || vx >= limit || vy >= limit) {
+        throw "OutMapRange";
+    }
+    const lat = tile2lat(mlc.y / tilesize, zoom_level);
+    const lng = tile2long(mlc.x / tilesize, zoom_level);
+    return { lat: lat, lng: lng }
+}
+
+function wgs84toviewport(lat, lng) {
+    //数据超界处理  经度 -180 180
+    //85.0511287798066  (2*Math.atan(Math.pow(Math.E,Math.PI))-Math.PI/2)/Math.PI*180
+    const latlimit = 85.051128;
+    const lngp = lng - Math.floor((lng + 180) / 360) * 360;
+    if (lat < (0 - latlimit) || lat > latlimit) {
+        throw "OutMapRange";
+    }
+    const my = lat2y(lat, zoom_level) * tilesize;
+    const mx = lon2x(lngp, zoom_level) * tilesize;
+    const vp = mplat2viewport(mx, my);
+    return { x: vp.x, y: vp.y };
+}
+
+
 function updateviewporttest(scrollx, scrolly, oldz, newz) {
     //计算出缩放后坐标系的偏移值
     // xv = xm + offset   ; offset = xv - xm
@@ -144,7 +172,9 @@ map.onmousedown = (e) => {
     moveflag = true;
     downpoing.x = e.offsetX;
     downpoing.y = e.offsetY;
-    console.log(coord.innerText);
+    console.log(zoom_level, e.offsetX, e.offsetY);
+    const wgs84 = viewport2wgs84(e.offsetX, e.offsetY);
+    console.log(wgs84, 'check', wgs84toviewport(wgs84.lat, wgs84.lng));
 }
 map.onmouseup = (e) => {
     console.log('鼠标松开');
@@ -152,18 +182,11 @@ map.onmouseup = (e) => {
 }
 map.onmousemove = (e) => {
     //输出latlng
-    const mlc = viewport2mplat(e.offsetX, e.offsetY);
-    let lat = tile2lat(mlc.y / tilesize, zoom_level);
-    let lng = tile2long(mlc.x / tilesize, zoom_level);
-    // const etsize = calTileSize();
-    // if (zoom_level != Math.floor(zoom_level)) {
-    //     console.log('resize', etsize, tilesize, lat, lng)
-    //     lat = tile2lat(mlc.y / etsize * tilesize, Math.floor(zoom_level + 1));
-    //     lng = tile2long(mlc.x / etsize * tilesize, Math.floor(zoom_level + 1));
-    // }
-
-    const coordstr = `(${e.offsetX},${e.offsetY})    -  (${mlc.x.toFixed(3)},${mlc.y.toFixed(3)})  -    (${lat},${lng})`;
-    coord.innerText = coordstr;
+    //const mlc = viewport2mplat(e.offsetX, e.offsetY);
+    //let lat = tile2lat(mlc.y / tilesize, zoom_level);
+    //let lng = tile2long(mlc.x / tilesize, zoom_level);
+    //const coordstr = `(${e.offsetX},${e.offsetY})    -  (${mlc.x.toFixed(3)},${mlc.y.toFixed(3)})  -    (${lat},${lng})`;
+    //coord.innerText = coordstr;
     //console.log(e.offsetX, e.offsetY);
     if (moveflag) {
         console.log('有效位移');
@@ -203,7 +226,7 @@ drawtest();
 
 
 
-Array.prototype.remove = function(val) {
+Array.prototype.remove = function (val) {
     const index = this.indexOf(val);
     if (index > -1) {
         return this.splice(index, 1);
@@ -284,7 +307,7 @@ function lon2tile(lon, z) {
 
 function lat2tile(lat, z) {
     return (Math.floor((1 - Math.log(Math.tan(lat * Math.PI / 180) +
-            1 / Math.cos(lat * Math.PI / 180)) / Math.PI) /
+        1 / Math.cos(lat * Math.PI / 180)) / Math.PI) /
         2 * Math.pow(2, z)));
 }
 
@@ -294,7 +317,7 @@ function lon2x(lon, z) {
 
 function lat2y(lat, z) {
     return ((1 - Math.log(Math.tan(lat * Math.PI / 180) +
-            1 / Math.cos(lat * Math.PI / 180)) / Math.PI) /
+        1 / Math.cos(lat * Math.PI / 180)) / Math.PI) /
         2 * Math.pow(2, z));
 }