【fix】修复经纬度坐标大于12级拖动上下偏移的问题

SuperMap · Jul 18, 2024 · faeb6b5 · faeb6b5
1 parent 8d617ed
commit faeb6b5
Show file tree

Hide file tree

Showing 7 changed files with 517 additions and 6 deletions.
diff --git a/dev-demos/l7_3857_上下拖动点位置.html b/dev-demos/l7_3857_上下拖动点位置.html
@@ -0,0 +1,150 @@
+<!--********************************************************************
+* Copyright© 2000 - 2023 SuperMap Software Co.Ltd. All rights reserved.
+*********************************************************************-->
+<!--********************************************************************
+* 该示例需要引入 
+* G6 (https://github.com/antvis/G6)
+*********************************************************************-->
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
+  <title>3857</title>
+  <style>
+    body {
+      margin: 0;
+      padding: 0;
+      width: 100%;
+      height: 100vh;
+      overflow: hidden;
+    }
+
+    #map {
+      width: 100%;
+      height: 100%;
+    }
+
+    #buttons {
+      position: fixed;
+      top: 10px;
+      padding: 10px;
+      width: 100%;
+      display: flex;
+      flex-flow: wrap;
+      z-index: 111;
+    }
+
+    #buttons button {
+      display: block;
+      width: 120px;
+      margin: 10px;
+    }
+  </style>
+  <link rel="stylesheet" type="text/css" href="./js/iclient-mapboxgl.css">
+  </link>
+  <script type="text/javascript" src="./js/mapbox-gl-enhance.js"></script>
+  <script type="text/javascript" src="../mapboxgl-l7-render/dist/index.js"></script>
+  <script type="text/javascript" src="./js/iclient-mapboxgl-es6.js"></script>
+</head>
+
+<body>
+  <button>clickme</button>
+  <button id="testid">修改l7样式</button>
+  <div id="buttons"></div>
+
+  <div id="map"></div>
+  <script type="module">
+    import { createButtons, createMarker, createShpePoint, data2 } from './js/l7layer.js'
+    const btn = document.querySelector('button');
+    btn.addEventListener('click', () => {
+      map.setZoom(12.1);
+    });
+    var host = window.isLocal ? window.server : 'https://iserver.supermap.io';
+    var attribution =
+      "<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox </a>" +
+      " with <span>© <a href='https://iclient.supermap.io' target='_blank'>SuperMap iClient</a> | </span>" +
+      " Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' target='_blank'>SuperMap iServer</a></span> ";
+    var features = {
+      type: 'FeatureCollection',
+      features: [
+        {
+          type: 'Feature',
+          properties: { length: 10, level: 43, "value": -4 },
+          geometry: {
+            type: 'LineString',
+            coordinates: [
+              [100, 10],
+              [100.05, 10.05]
+            ]
+          }
+        }
+      ]
+    };
+    var map = new mapboxgl.Map({
+      container: 'map', // container id
+      style: {
+        version: 8,
+        sources: {
+          'raster-tiles': {
+            type: 'raster',
+            tileSize: 256,
+            tiles: ['https://iserver.supermap.io/iserver/services/map-china400/rest/maps/China/zxyTileImage.png?z={z}&x={x}&y={y}'],
+          }
+        },
+
+        layers: [
+          {
+            id: 'simple-tiles',
+            type: 'raster',
+            source: 'raster-tiles',
+            minzoom: 0,
+            maxzoom: 22
+          }
+        ]
+      },
+      center: [120.148054, 30.25413],
+      zoom: 13
+    });
+
+    map.on('load', function (result) {
+      console.log(1111)
+      window.map = map;
+      new mapboxgl.Marker().setLngLat([120.152019, 30.259057]).addTo(map)
+
+
+      var data = [
+        {
+          w: 30.259057,
+          t: 24.6,
+          s: '海南',
+          l: 20,
+          m: '东方',
+          j: 120.152019,
+          h: 61407,
+          mag: 8.4,
+          capacity: 67200,
+          v: 1,
+          name: '铁路新村(华池路)',
+          icon: 'icon1',
+        }
+      ];
+      createShpePoint(data, map)
+      createButtons(map)
+      // createMarker(map)
+      // createMarker(map, data2)
+      map.on('click', (ev) => {
+        console.log(ev)
+      });
+      // map.getL7Scene().then(scene=>{
+      //   scene.on('click', (ev) => {
+      //     console.log(ev)
+      //   });
+      // })
+
+    });
+  </script>
+</body>
+
+</html>