analysis_interpolationAnalystByRBF.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301
  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_interpolationAnalystByRBF"></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_interpolationAnalystByRBF"></h5></div>
  36. <div class='panel-body content'>
  37. <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_RBF" onclick="interpolationRBF()"/>&nbsp;
  38. <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_clear" onclick="removeInterpolation()"/>
  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 host = window.isLocal ? window.server : "https://iserver.supermap.io",
  46. url=host+"/iserver/services/map-temperature/rest/maps/全国温度变化图",
  47. url2=host+"/iserver/services/spatialanalyst-sample/restjsr/spatialanalyst";
  48. var map,baseLayer,themeLayer;
  49. init();
  50. function init(){
  51. map = new SuperMap.Map("map",{controls: [
  52. new SuperMap.Control.ScaleLine(),
  53. new SuperMap.Control.Zoom(),
  54. new SuperMap.Control.Navigation({
  55. dragPanOptions: {
  56. enableKinetic: true
  57. }
  58. })], units: "m"
  59. });
  60. map.addControl(new SuperMap.Control.LayerSwitcher(), new SuperMap.Pixel(42, 80));
  61. map.allOverlays = true;
  62. baseLayer = new SuperMap.Layer.TiledDynamicRESTLayer("全国温度变化图", url, {transparent: true, cacheEnabled: true}, {maxResolution:"auto"});
  63. baseLayer.params.layersID="[0,1,2]";
  64. baseLayer.events.on({"layerInitialized":addLayer});
  65. }
  66. function addLayer() {
  67. map.addLayer(baseLayer);
  68. map.setCenter(new SuperMap.LonLat(531762, 3895330), 0);
  69. }
  70. //样条插值(径向基函数插值)法
  71. function interpolationRBF(){
  72. widgets.alert.clearAlert();
  73. removeInterpolation();
  74. var interpolationParams=new SuperMap.REST.InterpolationRBFAnalystParameters({
  75. //用于做插值分析的数据源中数据集的名称
  76. dataset: "SamplesP@Interpolation",
  77. //插值分析结果数据集的名称
  78. outputDatasetName: "RBF_Result",
  79. //插值分析结果数据源的名称
  80. outputDatasourceName: "Interpolation",
  81. //结果栅格数据集存储的像素格式
  82. pixelFormat: SuperMap.REST.PixelFormat.double,
  83. // 属性过滤条件
  84. // filterQueryParameter: {
  85. // attributeFilter: ""
  86. // },
  87. //存储用于进行插值分析的字段名称
  88. zValueFieldName: "AVG_TMP",
  89. //采取固定点数查找参与运算点的方式,此方式下,参与差值运算的点数默认为12。
  90. searchMode: "KDTREE_FIXED_COUNT",
  91. bounds:new SuperMap.Bounds(-2640403.6321084504, 1873792.1034850003, 3247669.390292245, 5921501.395578556)
  92. });
  93. var interpolationService=new SuperMap.REST.InterpolationAnalystService(url2,{
  94. eventListeners: {
  95. "processCompleted": processCompleted,
  96. "processFailed": processFailed
  97. }});
  98. interpolationService.processAsync(interpolationParams);
  99. }
  100. //插值分析成功后,使用栅格分段专题图展示
  101. function processCompleted(InterpolationAnalystEventArgs){
  102. var color1 = new SuperMap.REST.ServerColor(170,240,233),
  103. color2 = new SuperMap.REST.ServerColor(176,244,188),
  104. color3 = new SuperMap.REST.ServerColor(218,251,178),
  105. color4 = new SuperMap.REST.ServerColor(220,236,145),
  106. color5 = new SuperMap.REST.ServerColor(96,198,66),
  107. color6 = new SuperMap.REST.ServerColor(20,142,53),
  108. color7 = new SuperMap.REST.ServerColor(85,144,55),
  109. color8 = new SuperMap.REST.ServerColor(171,168,38),
  110. color9 = new SuperMap.REST.ServerColor(235,165,9),
  111. color10 = new SuperMap.REST.ServerColor(203,89,2),
  112. color11= new SuperMap.REST.ServerColor(157,25,1),
  113. color12= new SuperMap.REST.ServerColor(118,15,3),
  114. color13= new SuperMap.REST.ServerColor(112,32,7),
  115. color14= new SuperMap.REST.ServerColor(106,45,12),
  116. color15= new SuperMap.REST.ServerColor(129,80,50),
  117. color16= new SuperMap.REST.ServerColor(160,154,146),
  118. color17= new SuperMap.REST.ServerColor(107,47,14),
  119. color18= new SuperMap.REST.ServerColor(125,75,44),
  120. color19= new SuperMap.REST.ServerColor(146,110,88),
  121. color20= new SuperMap.REST.ServerColor(166,153,146),
  122. themeGridRangeIteme1 = new SuperMap.REST.ThemeGridRangeItem({
  123. start:-5,
  124. end:-3.4,
  125. color: color1
  126. }),
  127. themeGridRangeIteme2 = new SuperMap.REST.ThemeGridRangeItem({
  128. start: -3.4,
  129. end: -1.8,
  130. color: color2
  131. }),
  132. themeGridRangeIteme3 = new SuperMap.REST.ThemeGridRangeItem({
  133. start:-1.8,
  134. end:-0.2,
  135. color: color3
  136. }),
  137. themeGridRangeIteme4 = new SuperMap.REST.ThemeGridRangeItem({
  138. start: -0.2,
  139. end: 1.4,
  140. color: color4
  141. }),
  142. themeGridRangeIteme5 = new SuperMap.REST.ThemeGridRangeItem({
  143. start: 1.4,
  144. end: 3,
  145. color: color5
  146. }),
  147. themeGridRangeIteme6 = new SuperMap.REST.ThemeGridRangeItem({
  148. start: 3,
  149. end: 4.6,
  150. color: color6
  151. }),
  152. themeGridRangeIteme7 = new SuperMap.REST.ThemeGridRangeItem({
  153. start: 4.6,
  154. end: 6.2,
  155. color: color7
  156. }),
  157. themeGridRangeIteme8 = new SuperMap.REST.ThemeGridRangeItem({
  158. start: 6.2,
  159. end: 7.8,
  160. color: color8
  161. }),
  162. themeGridRangeIteme9 = new SuperMap.REST.ThemeGridRangeItem({
  163. start: 7.8,
  164. end: 9.4,
  165. color: color9
  166. }),
  167. themeGridRangeIteme10 = new SuperMap.REST.ThemeGridRangeItem({
  168. start: 9.4,
  169. end: 11,
  170. color: color10
  171. }),
  172. themeGridRangeIteme11 = new SuperMap.REST.ThemeGridRangeItem({
  173. start: 11,
  174. end: 12.6,
  175. color: color11
  176. }),
  177. themeGridRangeIteme12 = new SuperMap.REST.ThemeGridRangeItem({
  178. start: 12.6,
  179. end: 14.2,
  180. color: color12
  181. }),
  182. themeGridRangeIteme13 = new SuperMap.REST.ThemeGridRangeItem({
  183. start: 14.2,
  184. end: 15.8,
  185. color: color13
  186. }),
  187. themeGridRangeIteme14 = new SuperMap.REST.ThemeGridRangeItem({
  188. start: 15.8,
  189. end: 17.4,
  190. color: color14
  191. }),
  192. themeGridRangeIteme15 = new SuperMap.REST.ThemeGridRangeItem({
  193. start: 17.4,
  194. end: 19,
  195. color: color15
  196. }),
  197. themeGridRangeIteme16 = new SuperMap.REST.ThemeGridRangeItem({
  198. start: 19,
  199. end: 20.6,
  200. color: color16
  201. }),
  202. themeGridRangeIteme17 = new SuperMap.REST.ThemeGridRangeItem({
  203. start: 20.6,
  204. end: 22.2,
  205. color: color17
  206. }),
  207. themeGridRangeIteme18 = new SuperMap.REST.ThemeGridRangeItem({
  208. start: 22.2,
  209. end: 23.8,
  210. color: color18
  211. }),
  212. themeGridRangeIteme19 = new SuperMap.REST.ThemeGridRangeItem({
  213. start: 23.8,
  214. end: 25.4,
  215. color: color19
  216. }),
  217. themeGridRangeIteme20 = new SuperMap.REST.ThemeGridRangeItem({
  218. start: 25.4,
  219. end: 27,
  220. color: color20
  221. }),
  222. themeGridRange = new SuperMap.REST.ThemeGridRange({
  223. reverseColor:false,
  224. rangeMode: SuperMap.REST.RangeMode.EQUALINTERVAL,
  225. //栅格分段专题图子项数组
  226. items: [themeGridRangeIteme1,
  227. themeGridRangeIteme2,
  228. themeGridRangeIteme3,
  229. themeGridRangeIteme4,
  230. themeGridRangeIteme5,
  231. themeGridRangeIteme6,
  232. themeGridRangeIteme7,
  233. themeGridRangeIteme8,
  234. themeGridRangeIteme9,
  235. themeGridRangeIteme10,
  236. themeGridRangeIteme11,
  237. themeGridRangeIteme12,
  238. themeGridRangeIteme13,
  239. themeGridRangeIteme14,
  240. themeGridRangeIteme15,
  241. themeGridRangeIteme16,
  242. themeGridRangeIteme17,
  243. themeGridRangeIteme18,
  244. themeGridRangeIteme19,
  245. themeGridRangeIteme20
  246. ]
  247. }),
  248. themeParameters = new SuperMap.REST.ThemeParameters({
  249. //制作专题图的数据集数组
  250. datasetNames:[InterpolationAnalystEventArgs.result.dataset.split('@')[0]],
  251. // 制作专题图的数据集所在的数据源数组
  252. dataSourceNames: ["Interpolation"],
  253. joinItems: null,
  254. //专题图对象列表
  255. themes: [themeGridRange],
  256. types:['REGION']
  257. });
  258. var themeService = new SuperMap.REST.ThemeService(url, {eventListeners:{"processCompleted": themeCompleted, "processFailed": themeFailed}});
  259. themeService.processAsync(themeParameters);
  260. }
  261. //服务端成功返回专题图结果时调用
  262. function themeCompleted(themeEventArgs) {
  263. if(themeEventArgs.result.resourceInfo.id) {
  264. themeLayer = new SuperMap.Layer.TiledDynamicRESTLayer("插值分析结果图", url, {cacheEnabled:true,transparent: true,layersID: themeEventArgs.result.resourceInfo.id}, {"maxResolution":"auto"});
  265. themeLayer.events.on({"layerInitialized":addThemelayer});
  266. }
  267. }
  268. //添加专题图至map
  269. function addThemelayer() {
  270. map.addLayer(themeLayer);
  271. }
  272. //插值分析失败后调用
  273. function processFailed(ServiceFailedEventArgs){
  274. widgets.alert.showAlert(ServiceFailedEventArgs.error.errorMsg,false);
  275. }
  276. //服务端返回专题图结果失败时调用
  277. function themeFailed(serviceFailedEventArgs) {
  278. widgets.alert.showAlert(serviceFailedEventArgs.error.errorMsg,false);
  279. }
  280. //清除专题图图层
  281. function removeInterpolation(){
  282. widgets.alert.clearAlert();
  283. if (map.layers.length >1) {
  284. map.removeLayer(themeLayer, true);
  285. }
  286. }
  287. </script>
  288. </body>
  289. </html>