04_surfaceAnalystService.html 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <!--********************************************************************
  2. * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
  3. *********************************************************************-->
  4. <!DOCTYPE html>
  5. <html lang="en">
  6. <head>
  7. <meta charset="UTF-8">
  8. <title data-i18n="resources.title_surfaceAnalystService"></title>
  9. <script type="text/javascript" src="../js/include-web.js"></script>
  10. <script type="text/javascript" include="proj4" src="../../dist/mapboxgl/include-mapboxgl.js"></script>
  11. </head>
  12. <body style="margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
  13. <div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
  14. <script type="text/javascript">
  15. var host = window.isLocal ? window.server : "https://iserver.supermap.io";
  16. var map, surfaceAnalystService, surfaceAnalystParameters,
  17. attribution = "<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox </a>" +
  18. " with <span>© <a href='https://iclient.supermap.io' target='_blank'>SuperMap iClient</a> | </span>" +
  19. " Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' target='_blank'>SuperMap iServer</a></span> ",
  20. baseUrl = host + "/iserver/services/map-china400/rest/maps/China/zxyTileImage.png?z={z}&x={x}&y={y}",
  21. serviceUrl = host + "/iserver/services/spatialanalyst-sample/restjsr/spatialanalyst";
  22. map = new mapboxgl.Map({
  23. container: 'map',
  24. style: {
  25. "version": 8,
  26. "sources": {
  27. "raster-tiles": {
  28. "attribution": attribution,
  29. "type": "raster",
  30. "tiles": [baseUrl],
  31. "tileSize": 256
  32. }
  33. },
  34. "layers": [{
  35. "id": "simple-tiles",
  36. "type": "raster",
  37. "source": "raster-tiles",
  38. }]
  39. },
  40. center: [116.2740019864, 39.8970124079],
  41. zoom: 3
  42. });
  43. map.addControl(new mapboxgl.NavigationControl(), 'top-left');
  44. map.addControl(new mapboxgl.supermap.LogoControl(), 'bottom-right');
  45. map.on("load", function () {
  46. surfaceAnalystProcess();
  47. });
  48. function surfaceAnalystProcess() {
  49. //创建表面分析服务参数
  50. var region = {
  51. "type": "Feature",
  52. "geometry": {
  53. "type": "Polygon",
  54. "coordinates": [[
  55. [0, 4010338],
  56. [1063524, 4010338],
  57. [1063524, 3150322],
  58. [0, 3150322]
  59. ]]
  60. }
  61. };
  62. surfaceAnalystParameters = new SuperMap.DatasetSurfaceAnalystParameters({
  63. extractParameter: new SuperMap.SurfaceAnalystParametersSetting({
  64. datumValue: 0,
  65. interval: 2,
  66. resampleTolerance: 0,
  67. smoothMethod: SuperMap.SmoothMethod.BSPLINE,
  68. smoothness: 3,
  69. clipRegion: region
  70. }),
  71. dataset: "SamplesP@Interpolation",
  72. resolution: 9000,
  73. zValueFieldName: "AVG_TMP"
  74. });
  75. //创建表面分析服务实例
  76. surfaceAnalystService = new mapboxgl.supermap.SpatialAnalystService(serviceUrl);
  77. surfaceAnalystService.surfaceAnalysis(surfaceAnalystParameters, function (surfaceAnalystServiceResult) {
  78. var resultFeatures = surfaceAnalystServiceResult.result.recordset.features.features;
  79. var i, j, changesFeatures = [];
  80. for (i = 0; i < resultFeatures.length; i++) {
  81. var lineTemp = resultFeatures[i];
  82. var changeCoordinates = [];
  83. //转换line中的点
  84. for (j = 0; j < lineTemp.geometry.coordinates.length; j++) {
  85. var x = lineTemp.geometry.coordinates[j][0];
  86. var y = lineTemp.geometry.coordinates[j][1];
  87. var coordinate = proj4('EPSG:3857', 'EPSG:4326', [x, y]);
  88. //组成转后的点数组
  89. coordinate[0] += 106;
  90. changeCoordinates.push(coordinate)
  91. }
  92. lineTemp.geometry.coordinates = changeCoordinates;
  93. changesFeatures.push(lineTemp);
  94. }
  95. var changedResultFeatures = {
  96. "type": "FeatureCollection",
  97. "features": changesFeatures
  98. }
  99. map.addSource("analystDatas", {
  100. "type": "geojson",
  101. "data": changedResultFeatures
  102. });
  103. map.addLayer({
  104. "id": "analystLayer",
  105. "type": "line",
  106. "source": "analystDatas",
  107. "layout": {
  108. "line-join": "round",
  109. "line-cap": "round"
  110. },
  111. "paint": {
  112. "line-color": "red",
  113. "line-width": 4
  114. }
  115. });
  116. });
  117. }
  118. </script>
  119. </body>
  120. </html>