help.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242
  1. import * as turf from "@turf/turf";
  2. import parse from "wellknown";
  3. export let colors = [
  4. "#62ADED",
  5. "#DFE15A",
  6. "#6EDC8D",
  7. "#00A42E",
  8. "#F9B447",
  9. "#7F4FE5",
  10. "#FF6969",
  11. "#27CED9",
  12. "#DF56F5",
  13. "#DCFFAF",
  14. ];
  15. export function getCentroid(geojson, eindex) {
  16. if (turf.getType(geojson) === "Feature") {
  17. geojson = geojson.geometry;
  18. }
  19. if (turf.getType(geojson) === "Polygon") {
  20. return turf.centroid(geojson).geometry.coordinates;
  21. } else if (turf.getType(geojson) === "MultiPolygon") {
  22. let polygon = turf.polygon(geojson.coordinates[eindex]);
  23. return turf.centroid(polygon).geometry.coordinates;
  24. } else {
  25. throw new Error("Unsupported geometry type");
  26. }
  27. }
  28. // 数组变二维数组方法
  29. export function listToMatrix(list, elementsPerSubArray) {
  30. var matrix = [],
  31. i,
  32. k;
  33. for (i = 0, k = -1; i < list.length; i++) {
  34. if (i % elementsPerSubArray === 0) {
  35. k++;
  36. matrix[k] = [];
  37. }
  38. matrix[k].push(list[i]);
  39. }
  40. return matrix;
  41. }
  42. // 加载GeoJSON数据
  43. export function loadGeoJSON(geom, yanse, adata, fun) {
  44. let geojson = typeof geom === 'string' ? parse(geom) : geom;
  45. let polygon = Cesium.GeoJsonDataSource.load(geojson, {
  46. clampToGround: true,
  47. stroke: yanse
  48. ? Cesium.Color.fromCssColorString(yanse)
  49. : Cesium.Color.RED.withAlpha(0),
  50. fill: yanse || adata.fill
  51. ? Cesium.Color.fromCssColorString(adata.fill || yanse).withAlpha(adata.fill_a || 0.4)
  52. : Cesium.Color.WHITE.withAlpha(0), //Cesium.Color.fromCssColorString("rgba(10, 95, 152, 0.4)"), //注意:颜色必须大写,即不能为blue
  53. strokeWidth: adata.sw || 2,
  54. })
  55. polygon.then((data) => {
  56. viewer.dataSources.add(data);
  57. if (adata.isfly)
  58. viewer.flyTo(data, {
  59. offset: new Cesium.HeadingPitchRange(0, -45),
  60. });
  61. fun(data)
  62. });
  63. // let polygon = Cesium.GeoJsonDataSource.load(geojson, {
  64. // clampToGround: true,
  65. // stroke: yanse
  66. // ? Cesium.Color.fromCssColorString(yanse)
  67. // : Cesium.Color.RED.withAlpha(0),
  68. // fill: yanse
  69. // ? Cesium.Color.fromCssColorString(yanse).withAlpha(0.3)
  70. // : Cesium.Color.WHITE.withAlpha(0),
  71. // strokeWidth: isfly ? 5 : 2,
  72. // });
  73. // polygon.then(function (dataSource) {
  74. // viewer.dataSources.add(dataSource);
  75. // layerSources[id] = dataSource;
  76. // if (isfly)
  77. // viewer.flyTo(dataSource, {
  78. // offset: new Cesium.HeadingPitchRange(0, -45),
  79. // });
  80. // if (resdata) {
  81. // dataSource.entities.values.forEach((entity) => {
  82. // entity.properties = resdata;
  83. // });
  84. // }
  85. // });
  86. }
  87. export function removeGeoJSON(name) {
  88. if (!window.viewer) return;
  89. // viewer.entities.removeAll();
  90. // viewer.dataSources.removeAll();
  91. for (var i = viewer.dataSources._dataSources.length - 1; i >= 0; i--) {
  92. var das = viewer.dataSources._dataSources[i];
  93. if (das.name == name) viewer.dataSources.remove(das);
  94. }
  95. },
  96. export function addPonit() {
  97. // manager_multi_level_query.entities.add({
  98. // name: "manager_multi_level_query",
  99. // position: Cesium.Cartesian3.fromDegrees(longitude, latitude, 40),
  100. // billboard: {
  101. // // 图像地址,URI或Canvas的属性
  102. // image: "./static/images/overview/go.png",
  103. // height: 34,
  104. // width: 36,
  105. // scale: 1.0,
  106. // zIndex: 2,
  107. // show: true,
  108. // },
  109. // });
  110. }
  111. export function clearPoint() {
  112. // 图标
  113. // var entities = manager_multi_level_query.entities.values;
  114. // for (var i = entities.length - 1; i >= 0; i--) {
  115. // manager_multi_level_query.entities.remove(entities[i]);
  116. // }
  117. }
  118. export function moveHandler(fun) {
  119. let handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
  120. handler.setInputAction((event) => {
  121. var position = viewer.scene.pickPosition(event.endPosition);
  122. if (!position) return;
  123. fun(position)
  124. }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
  125. }
  126. export function pickPoint(isjs, fun) {
  127. let handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
  128. handler.setInputAction((event) => {
  129. var position = viewer.scene.pickPosition(event.position);
  130. if (!position)
  131. //点击到地球之外
  132. return false;
  133. if (isjs) {
  134. var cartographic = Cesium.Cartographic.fromCartesian(position);
  135. let lon = Cesium.Math.toDegrees(cartographic.longitude);
  136. let lat = Cesium.Math.toDegrees(cartographic.latitude);
  137. let height = cartographic.height;
  138. // let heading = viewer.scene.camera.heading;
  139. // let pitch = viewer.scene.camera.pitch;
  140. fun(lon, lat, height)
  141. }
  142. else fun(position, handler)
  143. handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
  144. }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
  145. }
  146. // 导出结果下载图片
  147. export function download(base64data, fu) {
  148. var image = new Image();
  149. image.src = base64data;
  150. image.onload = function () {
  151. var canvas = convertImageToCanvas(image, fu);
  152. var url = canvas.toDataURL("image/jpeg");
  153. var a = document.createElement("a");
  154. var event = new MouseEvent("click");
  155. a.download = new Date().getTime() + ".jpg"; // 指定下载图片的名称
  156. a.href = url;
  157. a.dispatchEvent(event); // 触发超链接的点击事件
  158. };
  159. }
  160. // 根据图片生成画布
  161. function convertImageToCanvas(image, fu) {
  162. var canvas = document.createElement("canvas");
  163. canvas.width = image.width;
  164. canvas.height = image.height;
  165. var ctx = canvas.getContext("2d");
  166. ctx.drawImage(image, 0, 0);
  167. if (typeof fu == 'function')
  168. fu(canvas, ctx)
  169. else drawLegends(canvas, ctx, fu);
  170. return canvas;
  171. }
  172. // 绘制图例
  173. function drawLegends(canvas, ctx, legends) {
  174. var padding = 10; // 图例与边缘的间距
  175. var lineHeight = 30; // 每行图例的高度
  176. var labW = 200;
  177. var x = canvas.width - padding - labW; // 图例的起始X坐标
  178. var y = canvas.height - legends.length * lineHeight - padding; // 图例的起始Y坐标
  179. // 绘制颜色块
  180. ctx.fillStyle = "#ffffff";
  181. ctx.fillRect(
  182. x - padding,
  183. y - padding,
  184. canvas.width - x + padding,
  185. canvas.height - y + padding
  186. );
  187. legends.forEach(function (legend, index) {
  188. // 绘制文本
  189. if (legend.scS) {
  190. ctx.fillStyle = "black";
  191. ctx.fillText(legend.scS, x, y + index * lineHeight + lineHeight / 2);
  192. // 绘制颜色块
  193. ctx.fillStyle = legend.fill;
  194. ctx.fillRect(
  195. x + (labW / 3) * 2,
  196. y + index * lineHeight,
  197. 30,
  198. lineHeight
  199. );
  200. } else {
  201. ctx.fillStyle = "black";
  202. let text = `${legend.name}:${legend.value}${legend.unit}`;
  203. ctx.fillText(text, x, y + index * lineHeight + lineHeight / 2);
  204. }
  205. });
  206. }
  207. /**
  208. *wms数据查询计算用户坐标应该减去的差值
  209. */
  210. function getZoomBbox(zoom) {
  211. let level0 = 142.03125
  212. let box = level0 / Math.pow(2, zoom)
  213. box = box / 2
  214. return box
  215. }
  216. /**
  217. *根据用户点击的坐标计算 bbox参数
  218. */
  219. export function bbox(latlng, zoom) {
  220. let box = getZoomBbox(zoom)
  221. let boxMin = {
  222. lat: latlng.lat - box,
  223. lng: latlng.lng - box
  224. }
  225. let boxMax = {
  226. lat: latlng.lat + box,
  227. lng: latlng.lng + box
  228. }
  229. // console.table({zoom,box,latlng,boxMin, boxMax })
  230. return `${boxMin.lng},${boxMin.lat},${boxMax.lng},${boxMax.lat}`
  231. }
  232. export function str2Unicode(str) {
  233. var es = [];
  234. for (var i = 0; i < str.length; i++)
  235. es[i] = ("00" + str.charCodeAt(i).toString(16)).slice(-4);
  236. return "\\u" + es.join("\\u");
  237. }