【fix】栅格查询限制查询范围，调整地图中心点与缩放级别 review by qiwei

SuperMap · Dec 1, 2023 · 4bb3043 · 4bb3043
1 parent a03a6b3
commit 4bb3043
Show file tree

Hide file tree

Showing 10 changed files with 103 additions and 18 deletions.
diff --git a/examples/leaflet/02_getGridCellInfos.html b/examples/leaflet/02_getGridCellInfos.html
@@ -27,7 +27,7 @@
             top: 0;
             right: 0;
             height: 100vh;
-            width: 500px;
+            width: 400px;
             padding: 20px;
             background: #fff;
             font-family: Avenir, Helvetica, Arial, sans-serif;
@@ -216,9 +216,8 @@ <h4 class="panel-title">
         map = L.map('map', {
             preferCanvas: true,
             crs: L.CRS.EPSG4326,
-            center: { lon: 30, lat: 0 },
-            maxZoom: 18,
-            zoom: 2
+            center: { lon: 120, lat: 28 },
+            zoom: 5
         });
 
         new L.supermap.TiledMapLayer(baseUrl, { noWrap: true }).addTo(map);
@@ -269,10 +268,31 @@ <h4 class="panel-title">
                 appendTable(res);
             })
         }
+        function getValuesCount(res) {
+            var count = 0;
+            if (!res.object.bounds) {
+                count += 1;
+            } else if (res.object.bounds && !Array.isArray(res.object.bounds)) {
+                count += res.result.valuesCount;
+            } else {
+                var customResult = res.result.customResult;
+                for(var i = 0 ; i < customResult.length ; i ++) {
+                    if (customResult[i].values) {
+                        count += customResult[i].valuesCount;
+                    } else {
+                        count += 1;
+                    }
+                }
+            }
+            return count;
+        }
         function appendTable(res) {
             if (!res) {
                 return;
             }
+            if ((res.error && res.error.code === 400) || getValuesCount(res) > 5000) {
+                return widgets.alert.showAlert(resources.msg_outOfQueryRange, false);
+            }
             // 展开table
             collapseTable();
             if (!res.object.bounds) {

diff --git a/examples/leaflet/img/l_getGridCellInfos.png b/examples/leaflet/img/l_getGridCellInfos.png
diff --git a/examples/locales/en-US/resources.js b/examples/locales/en-US/resources.js
@@ -1877,6 +1877,7 @@ window.examplesResources = {
         "msg_deleteFeatureFailed": 'Delete feature failed',
         "msg_geographicPosition": "geographical position error! ",
         "msg_gridQueryNote": "Note: Click the map at any position, the instance will start to grid query at this location, and the bottom left corner of the map will show the query results after the query is completed.",
+        "msg_outOfQueryRange": "Please narrow down the search scope。",
         "msg_drawQueryBounds": "Please draw the query range!",
         "msg_drawClipBounds": "Please draw the clip range!",
         "msg_chooseColor": "Please choose color value",

diff --git a/examples/locales/zh-CN/resources.js b/examples/locales/zh-CN/resources.js
@@ -1829,6 +1829,7 @@ window.examplesResources = {
         "msg_deleteFeatureFailed": '删除地物失败',
         "msg_geographicPosition": "地理位置错误！",
         "msg_gridQueryNote": "注：点击地图任意位置，案例以该位置进行栅格查询，查询完成后地图左下角会显示查询结果。",
+        "msg_outOfQueryRange": "请缩小查询范围。",
         "msg_drawQueryBounds": "请绘制查询范围!",
         "msg_drawClipBounds": "请绘制裁剪范围!",
         "msg_chooseColor": "请选颜色值",

diff --git a/examples/mapboxgl/02_getGridCellInfos.html b/examples/mapboxgl/02_getGridCellInfos.html
@@ -27,7 +27,7 @@
             top: 0;
             right: 0;
             height: 100vh;
-            width: 500px;
+            width: 400px;
             padding: 20px;
             background: #fff;
             font-family: Avenir, Helvetica, Arial, sans-serif;
@@ -236,8 +236,8 @@ <h4 class="panel-title">
                     "source": "raster-tiles",
                 }]
             },
-            center: [30, 0],
-            zoom: 2
+            center: [116, 32],
+            zoom: 4
         });
 
         map.addControl(new mapboxgl.supermap.LogoControl({ link: "https://iclient.supermap.io" }), 'bottom-right');
@@ -252,7 +252,6 @@ <h4 class="panel-title">
                 trash: true,
             }
         });
-        console.log($($('.mapboxgl-ctrl').get(1)));
         $($('.mapboxgl-ctrl').get(1)).hide();
         map.addControl(Draw, 'top-left')
         function queryResult() {
@@ -300,10 +299,31 @@ <h4 class="panel-title">
                 })
             }
         })
+        function getValuesCount(res) {
+            var count = 0;
+            if (!res.object.bounds) {
+                count += 1;
+            } else if (res.object.bounds && !Array.isArray(res.object.bounds)) {
+                count += res.result.valuesCount;
+            } else {
+                var customResult = res.result.customResult;
+                for (var i = 0; i < customResult.length; i++) {
+                    if (customResult[i].values) {
+                        count += customResult[i].valuesCount;
+                    } else {
+                        count += 1;
+                    }
+                }
+            }
+            return count;
+        }
         function appendTable(res) {
             if (!res) {
                 return;
             }
+            if ((res.error && res.error.code === 400) || getValuesCount(res) > 5000) {
+                return widgets.alert.showAlert(resources.msg_outOfQueryRange, false);
+            }
             // 展开table
             collapseTable();
             if (!res.object.bounds) {
@@ -373,7 +393,7 @@ <h4 class="panel-title">
             table.appendChild(thead);
             table.appendChild(tbody);
 
-            var theadInfo = '<tr><th>'+ resources.text_index +'</th><th>'+ resources.text_row_index +'</th><th>'+ resources.text_column_index +'</th><th>'+ resources.text_color_number +'</th><th>'+ resources.text_color_rgba +'</th></tr>';
+            var theadInfo = '<tr><th>' + resources.text_index + '</th><th>' + resources.text_row_index + '</th><th>' + resources.text_column_index + '</th><th>' + resources.text_color_number + '</th><th>' + resources.text_color_rgba + '</th></tr>';
             thead.append(theadInfo);
             thead.innerHTML = theadInfo;
             tbody.innerHTML = tbodyHtml;

diff --git a/examples/mapboxgl/img/mb_getGridCellInfos.png b/examples/mapboxgl/img/mb_getGridCellInfos.png
diff --git a/examples/maplibregl/02_getGridCellInfos.html b/examples/maplibregl/02_getGridCellInfos.html
@@ -53,7 +53,7 @@
             top: 0;
             right: 0;
             height: 100vh;
-            width: 500px;
+            width: 400px;
             padding: 20px;
             background: #fff;
             font-family: Avenir, Helvetica, Arial, sans-serif;
@@ -262,8 +262,8 @@ <h4 class="panel-title">
                     "source": "raster-tiles",
                 }]
             },
-            center: [30, 0],
-            zoom: 2
+            center: [116, 32],
+            zoom: 4
         });
         //mapbox 绘制要素图形控件
         var Draw = new MapboxDraw({
@@ -323,10 +323,31 @@ <h4 class="panel-title">
                 })
             }
         });
+        function getValuesCount(res) {
+            var count = 0;
+            if (!res.object.bounds) {
+                count += 1;
+            } else if (res.object.bounds && !Array.isArray(res.object.bounds)) {
+                count += res.result.valuesCount;
+            } else {
+                var customResult = res.result.customResult;
+                for(var i = 0 ; i < customResult.length ; i ++) {
+                    if (customResult[i].values) {
+                        count += customResult[i].valuesCount;
+                    } else {
+                        count += 1;
+                    }
+                }
+            }
+            return count;
+        }
         function appendTable(res) {
             if (!res) {
                 return;
             }
+            if ((res.error && res.error.code === 400) || getValuesCount(res) > 5000) {
+                return widgets.alert.showAlert(resources.msg_outOfQueryRange, false);
+            }
             // 展开table
             collapseTable();
             if (!res.object.bounds) {

diff --git a/examples/maplibregl/img/mb_getGridCellInfos.png b/examples/maplibregl/img/mb_getGridCellInfos.png
diff --git a/examples/openlayers/02_getGridCellInfos.html b/examples/openlayers/02_getGridCellInfos.html
@@ -29,7 +29,7 @@
             top: 0;
             right: 0;
             height: 100vh;
-            width: 500px;
+            width: 400px;
             padding: 20px;
             background: #fff;
             font-family: Avenir, Helvetica, Arial, sans-serif;
@@ -221,7 +221,8 @@ <h4 class="panel-title">
     </div>
     <script type="text/javascript" include="bootstrap,jquery,widgets" src="../js/include-web.js"></script>
     <script type="text/javascript">
-        var map, baseUrl = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/世界地图_Day",
+        var map,
+            baseUrl = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/世界地图_Day",
             url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/data-world/rest/data",
             draw,
             querylist = [],
@@ -230,8 +231,8 @@ <h4 class="panel-title">
             target: 'map',
             controls: ol.control.defaults({ attributionOptions: { collapsed: false } }).extend([new ol.supermap.control.Logo({ link: "https://iclient.supermap.io" })]),
             view: new ol.View({
-                center: [30, 0],
-                zoom: 3,
+                center: [120, 28],
+                zoom: 6,
                 projection: 'EPSG:4326',
                 multiWorld: true,
             })
@@ -274,10 +275,31 @@ <h4 class="panel-title">
                 appendTable(res);
             })
         }
+        function getValuesCount(res) {
+            var count = 0;
+            if (!res.object.bounds) {
+                count += 1;
+            } else if (res.object.bounds && !Array.isArray(res.object.bounds)) {
+                count += res.result.valuesCount;
+            } else {
+                var customResult = res.result.customResult;
+                for (var i = 0; i < customResult.length; i++) {
+                    if (customResult[i].values) {
+                        count += customResult[i].valuesCount;
+                    } else {
+                        count += 1;
+                    }
+                }
+            }
+            return count;
+        }
         function appendTable(res) {
-            if (!res || res.error) {
+            if (!res) {
                 return;
             }
+            if ((res.error && res.error.code === 400) || getValuesCount(res) > 5000) {
+                return widgets.alert.showAlert(resources.msg_outOfQueryRange, false);
+            }
             // 展开table
             collapseTable();
             if (!res.object.bounds) {
@@ -347,7 +369,7 @@ <h4 class="panel-title">
             table.appendChild(thead);
             table.appendChild(tbody);
 
-            var theadInfo = '<tr><th>'+ resources.text_index +'</th><th>'+ resources.text_row_index +'</th><th>'+ resources.text_column_index +'</th><th>'+ resources.text_color_number +'</th><th>'+ resources.text_color_rgba +'</th></tr>';
+            var theadInfo = '<tr><th>' + resources.text_index + '</th><th>' + resources.text_row_index + '</th><th>' + resources.text_column_index + '</th><th>' + resources.text_color_number + '</th><th>' + resources.text_color_rgba + '</th></tr>';
             thead.append(theadInfo);
             thead.innerHTML = theadInfo;
             tbody.innerHTML = tbodyHtml;

diff --git a/examples/openlayers/img/ol_getGridCellInfos.png b/examples/openlayers/img/ol_getGridCellInfos.png