theme_themeGridUnique.html 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
  1. <!--********************************************************************
  2. * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
  3. *********************************************************************-->
  4. <!DOCTYPE html>
  5. <html>
  6. <head>
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  8. <title data-i18n="resources.title_themeGridUnique"></title>
  9. <style type="text/css">
  10. .editPane {
  11. position: absolute;
  12. right: 60px;
  13. top: 50px;
  14. text-align: center;
  15. background: #FFF;
  16. z-index: 1000;
  17. }
  18. </style>
  19. </head>
  20. <body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
  21. <div class='panel panel-primary editPane' id='editPane' style="z-index: 99999">
  22. <div class='panel-heading'>
  23. <h5 class='panel-title text-center' data-i18n="resources.title_themeGridUnique"></h5>
  24. </div>
  25. <div class='panel-body' id='params'>
  26. <p></p>
  27. <div align='right' class='button-group'>
  28. <input type='button' id='btn1' class='btn btn-primary' data-i18n="[value]resources.btn_addThemeLayer" onclick="addThemeGridUnique()"/>
  29. <input type='button' id='btn2' class='btn btn-primary' data-i18n="[value]resources.text_input_value_clear" onclick="removeTheme()"/>
  30. </div>
  31. </div>
  32. </div>
  33. <div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
  34. <script type="text/javascript" include="bootstrap,widgets.alert" src="../js/include-web.js"></script>
  35. <script type="text/javascript" exclude="iclient-classic" src="../../dist/classic/include-classic.js"></script>
  36. <script type="text/javascript">
  37. var map, baseLayer, themeLayer,
  38. host = window.isLocal ? window.server : "https://iserver.supermap.io",
  39. url = host + "/iserver/services/map-jingjin/rest/maps/京津地区土地利用现状图";
  40. map = new SuperMap.Map("map", {
  41. controls: [
  42. new SuperMap.Control.LayerSwitcher(),
  43. new SuperMap.Control.ScaleLine(),
  44. new SuperMap.Control.Zoom(),
  45. new SuperMap.Control.Navigation({
  46. dragPanOptions: {
  47. enableKinetic: true
  48. }
  49. })]
  50. });
  51. baseLayer = new SuperMap.Layer.TiledDynamicRESTLayer("jingjin", url, {
  52. transparent: true,
  53. cacheEnabled: true
  54. }, {maxResolution: "auto"});
  55. baseLayer.events.on({"layerInitialized": addLayer});
  56. function addLayer() {
  57. map.addLayer(baseLayer);
  58. map.setCenter(new SuperMap.LonLat(117.2, 40.11), 0);
  59. map.allOverlays = true;
  60. }
  61. function addThemeGridUnique() {
  62. removeTheme();
  63. var themeService = new SuperMap.REST.ThemeService(url, {
  64. eventListeners: {
  65. "processCompleted": themeCompleted,
  66. "processFailed": themeFailed
  67. }
  68. });
  69. //定义单值专题图子项
  70. function setItems() {
  71. var items = new Array(),
  72. color0 = new SuperMap.REST.ServerColor(198, 244, 240),
  73. color1 = new SuperMap.REST.ServerColor(176, 244, 188),
  74. color2 = new SuperMap.REST.ServerColor(218, 251, 178),
  75. color3 = new SuperMap.REST.ServerColor(220, 236, 145),
  76. color4 = new SuperMap.REST.ServerColor(96, 198, 66),
  77. color5 = new SuperMap.REST.ServerColor(20, 142, 53),
  78. color6 = new SuperMap.REST.ServerColor(85, 144, 55),
  79. color7 = new SuperMap.REST.ServerColor(171, 168, 38),
  80. color8 = new SuperMap.REST.ServerColor(235, 165, 9),
  81. color9 = new SuperMap.REST.ServerColor(203, 89, 2),
  82. color10 = new SuperMap.REST.ServerColor(157, 25, 1),
  83. color11 = new SuperMap.REST.ServerColor(118, 15, 3),
  84. color12 = new SuperMap.REST.ServerColor(112, 32, 7),
  85. color13 = new SuperMap.REST.ServerColor(106, 45, 12),
  86. color14 = new SuperMap.REST.ServerColor(129, 80, 50),
  87. color15 = new SuperMap.REST.ServerColor(160, 154, 146);
  88. for (var i = -4; i < 2197; i++) {
  89. var num = parseInt(i / 135);
  90. var item = new SuperMap.REST.ThemeGridUniqueItem();
  91. item.caption = 1;
  92. item.unique = i;
  93. item.visible = true;
  94. switch (num) {
  95. case 0:
  96. item.color = color0;
  97. break;
  98. case 1:
  99. item.color = color1;
  100. break;
  101. case 2:
  102. item.color = color2;
  103. break;
  104. case 3:
  105. item.color = color3;
  106. break;
  107. case 4:
  108. item.color = color4;
  109. break;
  110. case 5:
  111. item.color = color5;
  112. break;
  113. case 6:
  114. item.color = color6;
  115. break;
  116. case 7:
  117. item.color = color7;
  118. break;
  119. case 8:
  120. item.color = color8;
  121. break;
  122. case 9:
  123. item.color = color9;
  124. break;
  125. case 10:
  126. item.color = color10;
  127. break;
  128. case 11:
  129. item.color = color11;
  130. break;
  131. case 12:
  132. item.color = color12;
  133. break;
  134. case 13:
  135. item.color = color13;
  136. break;
  137. case 14:
  138. item.color = color14;
  139. break;
  140. case 15:
  141. item.color = color15;
  142. break;
  143. default:
  144. item.color = color0;
  145. break;
  146. }
  147. items.push(item);
  148. }
  149. return items;
  150. }
  151. var themeGridUnique = new SuperMap.REST.ThemeGridUnique({
  152. defaultcolor: new SuperMap.REST.ServerColor(0, 0, 0),
  153. items: setItems()
  154. });
  155. themeParameters = new SuperMap.REST.ThemeParameters({
  156. datasetNames: ["JingjinTerrain"],
  157. dataSourceNames: ["Jingjin"],
  158. themes: [themeGridUnique],
  159. types: ['GRID']
  160. });
  161. themeService.processAsync(themeParameters);
  162. }
  163. function themeCompleted(themeEventArgs) {
  164. if (themeEventArgs.result.resourceInfo.id) {
  165. themeLayer = new SuperMap.Layer.TiledDynamicRESTLayer("jingjin_themeGridUnique", url, {
  166. cacheEnabled: false,
  167. transparent: true,
  168. layersID: themeEventArgs.result.resourceInfo.id
  169. }, {"maxResolution": "auto"});
  170. themeLayer.events.on({"layerInitialized": addThemeLayer});
  171. }
  172. }
  173. function addThemeLayer() {
  174. map.addLayer(themeLayer);
  175. }
  176. function themeFailed(serviceFailedEventArgs) {
  177. widgets.alert.showAlert(serviceFailedEventArgs.error.errorMsg, false);
  178. }
  179. function removeTheme() {
  180. if (map.layers.length > 1) {
  181. map.removeLayer(themeLayer, true);
  182. }
  183. }
  184. </script>
  185. </body>
  186. </html>