analysis_densityKernelAnalyst.html 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  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_densityAnalystService"></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.text_densityAnalystService"></h5></div>
  36. <div class='panel-body content'>
  37. <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_densityAnalyst" onclick="addResultLayer()"/>&nbsp;
  38. <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_removeTheme" onclick="removeTheme()"/>
  39. </div>
  40. </div>
  41. <div id="map"></div>
  42. <script type="text/javascript" include="bootstrap,widgets.alert" src="../js/include-web.js"></script>
  43. <script type="text/javascript" exclude="iclient-classic" src="../../dist/classic/include-classic.js"></script>
  44. <script>
  45. var map, baseLayer, resultLayer,
  46. host = window.isLocal ? window.server : "https://iserver.supermap.io",
  47. url = host + "/iserver/services/map-changchun/rest/maps/长春市区图",
  48. url2 = host + "/iserver/services/spatialanalyst-changchun/restjsr/spatialanalyst";
  49. init();
  50. function init() {
  51. map = new SuperMap.Map("map", {
  52. controls: [
  53. new SuperMap.Control.ScaleLine(),
  54. new SuperMap.Control.PanZoomBar(),
  55. new SuperMap.Control.Navigation({
  56. dragPanOptions: {
  57. enableKinetic: true
  58. }
  59. })]
  60. });
  61. map.addControl(new SuperMap.Control.LayerSwitcher(), new SuperMap.Pixel(58, 150));
  62. //将“长春市区图”置为底图
  63. baseLayer = new SuperMap.Layer.TiledDynamicRESTLayer("长春市区图", url, {
  64. transparent: true,
  65. cacheEnabled: true
  66. }, {maxResolution: "auto"});
  67. baseLayer.events.on({"layerInitialized": addBaseLayer});
  68. }
  69. function addBaseLayer() {
  70. map.addLayer(baseLayer);
  71. map.setCenter(new SuperMap.LonLat(5800, -3000), 2);
  72. map.allOverlays = true;
  73. }
  74. function addResultLayer() {
  75. widgets.alert.clearAlert();
  76. //移除核密度分析的结果专题图层
  77. removeTheme();
  78. //创建一个核密度分析服务实例
  79. var densityAnalystService = new SuperMap.REST.DensityAnalystService(url2, {
  80. eventListeners: {
  81. "processCompleted": KernelAnalystCompleted,
  82. "processFailed": KernelAnalystFailed
  83. }
  84. });
  85. //创建一个核密度分析参数示例
  86. var densityKernelAnalystParameters = new SuperMap.REST.DensityKernelAnalystParameters({
  87. //指定数据集
  88. dataset: "Railway@Changchun",
  89. //指定范围
  90. bounds: new SuperMap.Bounds(3800, -3800, 8200, -2200),
  91. //指定数据集中用于核密度分析的字段
  92. fieldName: "SmLength",
  93. searchRadius: 50, //Railway@Changchun的单位是米
  94. //结果数据集名称
  95. resultGridName: "KernelDensity_Result",
  96. deleteExistResultDataset: true
  97. });
  98. densityAnalystService.processAsync(densityKernelAnalystParameters);
  99. }
  100. //用栅格专题图展示分析结果
  101. function KernelAnalystCompleted(densityKernelAnalysEventArgs) {
  102. var color1 = new SuperMap.REST.ServerColor(255, 212, 170),
  103. color2 = new SuperMap.REST.ServerColor(255, 127, 0),
  104. color3 = new SuperMap.REST.ServerColor(191, 95, 0),
  105. color4 = new SuperMap.REST.ServerColor(255, 0, 0),
  106. color5 = new SuperMap.REST.ServerColor(191, 0, 0),
  107. themeGridRangeIteme1 = new SuperMap.REST.ThemeGridRangeItem({
  108. start: 0,
  109. end: 0.05,
  110. color: color1
  111. }),
  112. themeGridRangeIteme2 = new SuperMap.REST.ThemeGridRangeItem({
  113. start: 0.05,
  114. end: 5,
  115. color: color2
  116. }),
  117. themeGridRangeIteme3 = new SuperMap.REST.ThemeGridRangeItem({
  118. start: 5,
  119. end: 10,
  120. color: color3
  121. }),
  122. themeGridRangeIteme4 = new SuperMap.REST.ThemeGridRangeItem({
  123. start: 10,
  124. end: 100,
  125. color: color4
  126. }),
  127. themeGridRangeIteme5 = new SuperMap.REST.ThemeGridRangeItem({
  128. start: 100,
  129. end: 360,
  130. color: color5
  131. }),
  132. themeGridRange = new SuperMap.REST.ThemeGridRange({
  133. reverseColor: false,
  134. rangeMode: SuperMap.REST.RangeMode.EQUALINTERVAL,
  135. //栅格分段专题图子项数组
  136. items: [themeGridRangeIteme1,
  137. themeGridRangeIteme2,
  138. themeGridRangeIteme3,
  139. themeGridRangeIteme4,
  140. themeGridRangeIteme5
  141. ]
  142. }),
  143. themeParameters = new SuperMap.REST.ThemeParameters({
  144. //制作专题图的数据集(核密度分析的结果数据集)
  145. datasetNames: [densityKernelAnalysEventArgs.result.dataset.split('@')[0]],
  146. dataSourceNames: ["Changchun"],
  147. joinItems: null,
  148. themes: [themeGridRange],
  149. types: ['REGION']
  150. });
  151. var themeService = new SuperMap.REST.ThemeService(url, {
  152. eventListeners: {
  153. "processCompleted": themeCompleted,
  154. "processFailed": themeFailed
  155. }
  156. });
  157. themeService.processAsync(themeParameters);
  158. }
  159. function themeCompleted(themeEventArgs) {
  160. if (themeEventArgs.result.resourceInfo.id) {
  161. resultLayer = new SuperMap.Layer.TiledDynamicRESTLayer("核密度分析结果", url, {
  162. cacheEnabled: false,
  163. transparent: true,
  164. layersID: themeEventArgs.result.resourceInfo.id
  165. }, {"maxResolution": "auto"});
  166. resultLayer.events.on({"layerInitialized": addThemelayer});
  167. resultLayer.setOpacity(0.8);
  168. }
  169. }
  170. function addThemelayer() {
  171. //将专题图添加到地图
  172. map.addLayer(resultLayer);
  173. }
  174. function themeFailed(serviceFailedEventArgs) {
  175. widgets.alert.showAlert(serviceFailedEventArgs.error.errorMsg,false);
  176. }
  177. function KernelAnalystFailed(serviceFailedEventArgs) {
  178. widgets.alert.showAlert(serviceFailedEventArgs.error.errorMsg,false);
  179. }
  180. //移除专题图
  181. function removeTheme() {
  182. widgets.alert.clearAlert();
  183. if (map.layers.length > 1) {
  184. map.removeLayer(resultLayer, true);
  185. }
  186. }
  187. </script>
  188. </body>
  189. </html>