query_queryByGeometry.html 10.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267
  1. <!--********************************************************************
  2. * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
  3. *********************************************************************-->
  4. <!DOCTYPE html>
  5. <html>
  6. <head>
  7. <meta charset="utf-8">
  8. <title data-i18n="resources.title_queryByGeometry"></title>
  9. <style type="text/css">
  10. body {
  11. margin: 0;
  12. overflow: hidden;
  13. background: #fff;
  14. width: 100%;
  15. height: 100%
  16. }
  17. #map {
  18. position: absolute;
  19. width: 100%;
  20. height: 100%;
  21. }
  22. #toolbar {
  23. position: absolute;
  24. top: 50px;
  25. right: 10px;
  26. text-align: center;
  27. z-index: 100;
  28. border-radius: 4px;
  29. }
  30. </style>
  31. </head>
  32. <body>
  33. <div id="toolbar" class="panel panel-primary">
  34. <div class='panel-heading'>
  35. <h5 class='panel-title text-center' data-i18n="resources.title_queryByGeometry"></h5></div>
  36. <div class='panel-body content'>
  37. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_point" onclick="drawGeometry3()"/>
  38. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_line" onclick="drawGeometry4()"/>
  39. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_rectangle" onclick="drawGeometry5()"/>
  40. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_circle" onclick="drawGeometry1()"/>
  41. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_polygon" onclick="drawGeometry2()"/>
  42. <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_clear" onclick="clearFeatures()"/>
  43. </div>
  44. </div>
  45. <div id="map"></div>
  46. <script type="text/javascript" include="bootstrap,widgets.alert" src="../js/include-web.js"></script>
  47. <script type="text/javascript" exclude="iclient-classic" src="../../dist/classic/include-classic.js"></script>
  48. <script>
  49. var map, local, layer, vectorLayer, vectorLayer1, drawPolygon, markerLayer, drawPoint, drawLine,
  50. style = {
  51. strokeColor: "#304DBE",
  52. strokeWidth: 1,
  53. pointerEvents: "visiblePainted",
  54. fillColor: "#304DBE",
  55. fillOpacity: 0.5
  56. },
  57. host = window.isLocal ? window.server : "https://iserver.supermap.io",
  58. url = host + "/iserver/services/map-world/rest/maps/World";
  59. init();
  60. function init() {
  61. layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, {
  62. transparent: true,
  63. cacheEnabled: true
  64. }, {maxResolution: "auto"});
  65. layer.events.on({"layerInitialized": addLayer});
  66. vectorLayer = new SuperMap.Layer.Vector("Vector Layer");
  67. vectorLayer1 = new SuperMap.Layer.Vector("Vector Layer1");
  68. markerLayer = new SuperMap.Layer.Markers("Markers");
  69. //几何圆查询
  70. drawPolygon1 = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.RegularPolygon, {handlerOptions: {sides: 50}});
  71. drawPolygon1.events.on({"featureadded": drawCompleted});
  72. //多边形查询
  73. drawPolygon2 = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.Polygon);
  74. drawPolygon2.events.on({"featureadded": drawCompleted});
  75. //点查询
  76. drawPoint = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.Point);
  77. drawPoint.events.on({"featureadded": drawPointCompleted});
  78. //线查询
  79. drawLine = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.Path);
  80. drawLine.events.on({"featureadded": drawPointCompleted});
  81. //矩形
  82. drawRectangle = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.Box);
  83. drawRectangle.events.on({"featureadded": drawRectangleCompleted});
  84. map = new SuperMap.Map("map", {
  85. controls: [
  86. new SuperMap.Control.ScaleLine(),
  87. new SuperMap.Control.Zoom(),
  88. new SuperMap.Control.Navigation({
  89. dragPanOptions: {
  90. enableKinetic: true
  91. }
  92. }),
  93. drawPolygon1, drawPolygon2, drawPoint, drawLine, drawRectangle]
  94. });
  95. map.addControl(new SuperMap.Control.LayerSwitcher(), new SuperMap.Pixel(42, 80));
  96. }
  97. function addLayer() {
  98. map.addLayers([layer, vectorLayer, vectorLayer1, markerLayer]);
  99. map.setCenter(new SuperMap.LonLat(0, 0), 0);
  100. }
  101. function clearStatus() {
  102. vectorLayer.removeAllFeatures();
  103. vectorLayer1.removeAllFeatures();
  104. markerLayer.clearMarkers();
  105. }
  106. //画圆
  107. function drawGeometry1() {
  108. //先清除上次的显示结果
  109. clearStatus();
  110. drawPolygon1.activate();
  111. }
  112. //画多边形
  113. function drawGeometry2() {
  114. //先清除上次的显示结果
  115. clearStatus();
  116. drawPolygon2.activate();
  117. }
  118. //画点
  119. function drawGeometry3() {
  120. //先清除上次的显示结果
  121. clearStatus();
  122. drawPoint.activate();
  123. }
  124. //画线
  125. function drawGeometry4() {
  126. //先清除上次的显示结果
  127. clearStatus();
  128. drawLine.activate();
  129. }
  130. //画矩形
  131. function drawGeometry5() {
  132. //先清除上次的显示结果
  133. clearStatus();
  134. drawRectangle.activate();
  135. }
  136. function drawCompleted(drawGeometryArgs) {
  137. var feature = new SuperMap.Feature.Vector();
  138. feature.geometry = drawGeometryArgs.feature.geometry,
  139. feature.style = style;
  140. vectorLayer.addFeatures(feature);
  141. var queryParam, queryByGeometryParameters, queryService;
  142. queryParam = new SuperMap.REST.FilterParameter({name: "Capitals@World.1"});
  143. queryByGeometryParameters = new SuperMap.REST.QueryByGeometryParameters({
  144. queryParams: [queryParam],
  145. geometry: drawGeometryArgs.feature.geometry,
  146. spatialQueryMode: SuperMap.REST.SpatialQueryMode.INTERSECT
  147. });
  148. queryService = new SuperMap.REST.QueryByGeometryService(url, {
  149. eventListeners: {
  150. "processCompleted": processCompleted,
  151. "processFailed": processFailed
  152. }
  153. });
  154. queryService.processAsync(queryByGeometryParameters);
  155. }
  156. function drawPointCompleted(drawGeometryArgs) {
  157. var feature = new SuperMap.Feature.Vector();
  158. feature.geometry = drawGeometryArgs.feature.geometry,
  159. feature.style = style;
  160. vectorLayer.addFeatures(feature);
  161. var queryParam, queryByGeometryParameters, queryService;
  162. queryParam = new SuperMap.REST.FilterParameter({name: "Countries@World"});
  163. queryByGeometryParameters = new SuperMap.REST.QueryByGeometryParameters({
  164. queryParams: [queryParam],
  165. geometry: drawGeometryArgs.feature.geometry,
  166. spatialQueryMode: SuperMap.REST.SpatialQueryMode.INTERSECT
  167. });
  168. queryService = new SuperMap.REST.QueryByGeometryService(url, {
  169. eventListeners: {
  170. "processCompleted": processCompleted,
  171. "processFailed": processFailed
  172. }
  173. });
  174. queryService.processAsync(queryByGeometryParameters);
  175. }
  176. //矩形
  177. function drawRectangleCompleted(obj) {
  178. drawRectangle.deactivate();
  179. //先清除上次的显示结果
  180. clearStatus();
  181. var feature = obj.feature;
  182. feature.style = style;
  183. vectorLayer.addFeatures(feature);
  184. var queryBounds = feature.geometry.bounds;
  185. var queryParam, queryByBoundsParams, queryService;
  186. queryParam = new SuperMap.REST.FilterParameter({name: "Capitals@World.1"});//FilterParameter设置查询条件,name是必设的参数,(图层名称格式:数据集名称@数据源别名)
  187. queryByBoundsParams = new SuperMap.REST.QueryByBoundsParameters({
  188. queryParams: [queryParam],
  189. bounds: queryBounds
  190. });//queryParams查询过滤条件参数数组。bounds查询范围
  191. queryService = new SuperMap.REST.QueryByBoundsService(url, {
  192. eventListeners: {
  193. "processCompleted": processCompleted,
  194. "processFailed": processFailed
  195. }
  196. });
  197. queryService.processAsync(queryByBoundsParams);//向服务端传递参数,然后服务端返回对象
  198. }
  199. function processCompleted(queryEventArgs) {
  200. drawPolygon1.deactivate();
  201. drawPolygon2.deactivate();
  202. drawPoint.deactivate();
  203. drawLine.deactivate();
  204. drawRectangle.deactivate();
  205. var i, j, result = queryEventArgs.result;
  206. if (result && result.recordsets) {
  207. for (i = 0, recordsets = result.recordsets, len = recordsets.length; i < len; i++) {
  208. if (recordsets[i].features) {
  209. for (j = 0; j < recordsets[i].features.length; j++) {
  210. var feature = recordsets[i].features[j];
  211. var point = feature.geometry;
  212. if (point.CLASS_NAME == SuperMap.Geometry.Point.prototype.CLASS_NAME) {
  213. var size = new SuperMap.Size(44, 33),
  214. offset = new SuperMap.Pixel(-(size.w / 2), -size.h),
  215. icon = new SuperMap.Icon("./images/marker.png", size, offset);
  216. markerLayer.addMarker(new SuperMap.Marker(new SuperMap.LonLat(point.x, point.y), icon));
  217. } else {
  218. feature.style = style;
  219. vectorLayer1.addFeatures(feature);
  220. }
  221. }
  222. }
  223. }
  224. }
  225. }
  226. function processFailed(e) {
  227. widgets.alert.showAlert(e.error.errorMsg, false);
  228. }
  229. function clearFeatures() {
  230. vectorLayer.removeAllFeatures();
  231. vectorLayer1.removeAllFeatures();
  232. markerLayer.clearMarkers();
  233. }
  234. </script>
  235. </body>
  236. </html>