maps.js 53 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415
  1. window.maps = {};
  2. window.panels = {};
  3. window.bs = {};
  4. window.utils = {};
  5. window.Q = {};
  6. window.mapDatas = {};
  7. panels.layerTreePanelIndex = undefined;
  8. panels.lastConditionPanelIndex = undefined;
  9. panels.lastResultPanelIndex = undefined;
  10. panels.getCesiumHeight = function() {
  11. return $('#cesiumContainer').height();
  12. }
  13. panels.getCesiumWidth = function() {
  14. return $('#cesiumContainer').width();
  15. }
  16. panels.getConditionPanelWidth = function() {
  17. return $("#panel-result").width();
  18. }
  19. mapDatas.getLayerNameByCaption = function(caption) {
  20. for (let index = 0; index < CONST_VALUES.GX_Datas.length; index++) {
  21. const dat = CONST_VALUES.GX_Datas[index];
  22. if (dat.name == caption)
  23. return dat.dataSetName;
  24. }
  25. return "";
  26. }
  27. mapDatas.getDataInfoByName = function(name) {
  28. for (let index = 0; index < CONST_VALUES.GX_Datas.length; index++) {
  29. const dat = CONST_VALUES.GX_Datas[index];
  30. if (dat.name == name)
  31. return dat;
  32. }
  33. return undefined;
  34. }
  35. mapDatas.getFeatureInfo = function() {
  36. mapDatas.infoboxContainer = document.getElementById("bubble");
  37. maps.mapViewer.customInfobox = mapDatas.infoboxContainer;
  38. maps.mapViewer.pickEvent.addEventListener(function(feature) {
  39. $("blockquote").html("");
  40. let attributes = "<div class='infoContent'>";
  41. for (let att in feature) {
  42. if (att.toUpperCase().startsWith("SM")) {
  43. continue;
  44. }
  45. if (att.toUpperCase().startsWith("SS")) {
  46. continue;
  47. }
  48. let attValue = feature[att];
  49. let attr = "<div class='infoItem'>" +
  50. "<div class='infoBoxAttrName' title='" + att + "'>" + att + "</div>" +
  51. "<div class='infoBoxAttrSplit'>:</div>" +
  52. "<div class='infoBoxAttrValue' title='" + attValue + "'>" + attValue + "</div>" +
  53. "</div>";
  54. attributes += attr;
  55. }
  56. attributes += "</div>";
  57. $("blockquote").append(attributes);
  58. });
  59. }
  60. Q.queryBySql = function(datasetName, wsName, sql, fromIndex, toIndex, callback) {
  61. let sqlParam = new SuperMap.GetFeaturesBySQLParameters({
  62. queryParameter: {
  63. name: datasetName + "@" + wsName,
  64. attributeFilter: sql
  65. },
  66. datasetNames: [wsName + ":" + datasetName],
  67. fromIndex: fromIndex,
  68. toIndex: toIndex
  69. });
  70. L.supermap.featureService(CONST_VALUES.GX_Datas_BaseUrl).getFeaturesBySQL(sqlParam,
  71. function(serviceResult) {
  72. if (callback != undefined) {
  73. callback(serviceResult)
  74. }
  75. });
  76. }
  77. Q.query = function(queryObject, callback) {
  78. var sqlParam = new SuperMap.GetFeaturesBySQLParameters({
  79. queryParameter: {
  80. name: queryObject.datasetName + "@" + queryObject.wsName,
  81. attributeFilter: queryObject.sql
  82. },
  83. datasetNames: [queryObject.wsName + ":" + queryObject.datasetName],
  84. fromIndex: queryObject.fromIndex,
  85. toIndex: queryObject.toIndex,
  86. groupBy: queryObject.groupBy,
  87. fields: queryObject.fields
  88. });
  89. L.supermap
  90. .featureService(CONST_VALUES.GX_Datas_BaseUrl)
  91. .getFeaturesBySQL(sqlParam, function(serviceResult) {
  92. if (callback != undefined) {
  93. callback(serviceResult)
  94. }
  95. });
  96. }
  97. utils.guid = function() {
  98. return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
  99. let r = Math.random() * 16 | 0,
  100. v = c == 'x' ? r : (r & 0x3 | 0x8);
  101. return v.toString(16);
  102. });
  103. }
  104. bs.registerNavMenus = function() {
  105. $(".layui-side .layui-nav-child a").click(function(e) {
  106. const id = e.target.id;
  107. if (id == undefined) {
  108. layer.msg('功能未实现!', {
  109. icon: 7
  110. });
  111. return;
  112. }
  113. if (id.length === 0) {
  114. layer.msg('功能未实现!', {
  115. icon: 7
  116. });
  117. return;
  118. }
  119. panels.loadPanel("/static/maps/bs/" + id + ".html", e.target.innerText);
  120. });
  121. $("#q-Spatial").click(function(e) {
  122. $("#tool-SpatialQuery").css("display", "inline-block");
  123. });
  124. }
  125. function onload(Cesium) {
  126. //初始化viewer部件,添加STK地形服务
  127. let navigation = false;
  128. if (location.pathname.indexOf("start") >= 0) {
  129. navigation = true;
  130. }
  131. let viewer = new Cesium.Viewer('cesiumContainer', {
  132. //sceneModePicker: true,
  133. navigation: navigation,
  134. selectionIndicator: false,
  135. });
  136. viewer.imageryLayers.addImageryProvider(new Cesium.BingMapsImageryProvider({
  137. url: 'https://dev.virtualearth.net',
  138. mapStyle: Cesium.BingMapsStyle.AERIAL,
  139. key: URL_CONFIG.BING_MAP_KEY
  140. }));
  141. maps.mapViewer = viewer;
  142. maps.scene = viewer.scene;
  143. $(".cesium-viewer-bottom").remove();
  144. $('#loadingbar').remove();
  145. layui.use('element', function() {});
  146. maps.loadSmScene();
  147. panels.regEvents();
  148. panels.setDateTime();
  149. const helper = new Cesium.EventHelper();
  150. helper.add(viewer.scene.globe.tileLoadProgressEvent, function(e) {
  151. if (e == 0 && window.firstLoad) {
  152. window.firstLoad = false;
  153. $("#load_bg").remove(); //关闭加载动画
  154. $(".load_box").remove();
  155. }
  156. });
  157. }
  158. panels.setDateTime = function() {
  159. setInterval(() => {
  160. let dt = new Date();
  161. let yyyymmdd = dt.getFullYear() + " " + (dt.getMonth() + 1) + " " + dt.getDate();
  162. let sec = dt.getSeconds();
  163. sec = sec < 10 ? "0" + sec : sec + "";
  164. let time = (dt.getHours() < 12 ? "上午" : "下午") + " " + dt.getHours() + ":" + dt.getMinutes() + ":" + sec;
  165. $('.datetime .time').html(time);
  166. $('.datetime .date').html(yyyymmdd);
  167. }, 1000);
  168. }
  169. panels.menuLevel = {};
  170. panels.regEvents = function() {
  171. $('.query-type-enum div').click(function(e) {
  172. $('.query-type-enum div').removeClass("query-type-enum-select");
  173. $(this).addClass("query-type-enum-select");
  174. $("#queryType-subType").html('');
  175. if (panels.lastResultPanelIndex != undefined) {
  176. layui.layer.close(panels.lastResultPanelIndex);
  177. layui.layer.closeAll();
  178. }
  179. panels.menuLevel[panels.menuLevel.L1] = this;
  180. let id = $(this).find('span').attr('qs-name');
  181. if (id == undefined) return;
  182. $("#queryType-subType").html($(this).find('span').html());
  183. let htmlUrl = "/static/maps/bs/" + id + ".html";
  184. $.ajax({
  185. url: htmlUrl,
  186. success: function(htmlContext) {
  187. $('.queryConditionsContainer').html('');
  188. $('.queryConditionsContainer').html(htmlContext);
  189. layui.use(['form'], function() {
  190. let form = layui.form;
  191. form.render();
  192. });
  193. },
  194. error: function() {
  195. $('.queryConditionsContainer').html('');
  196. layui.layer.msg('功能未实现!', {
  197. icon: 7
  198. });
  199. }
  200. });
  201. });
  202. $('.head-menus span').click(function(e) {
  203. if (panels.lastResultPanelIndex != undefined) {
  204. layui.layer.close(panels.lastResultPanelIndex);
  205. layui.layer.closeAll();
  206. }
  207. $("#queryType-subType").html('未选择类型');
  208. $(".query-type-enum div").removeClass('query-type-enum-select ');
  209. let selected = $(this).hasClass('head-menus-menu-select');
  210. $('.head-menus span').removeClass('head-menus-menu-select');
  211. if (!selected) {
  212. $(this).addClass('head-menus-menu-select');
  213. $('.q-s-icon').removeClass('qs-hidden');
  214. } else {
  215. $('.q-s-icon').addClass('qs-hidden');
  216. $('.q-s-type').addClass('qs-hidden');
  217. }
  218. let qureyOrStatics = $(this).hasClass('qs-q');
  219. //点击了查询按钮
  220. if (qureyOrStatics) {
  221. panels.menuLevel.L1 = 2;
  222. $('.qs-q').removeClass('qs-hidden');
  223. $('.qs-s').addClass('qs-hidden');
  224. } else {
  225. panels.menuLevel.L1 = 1;
  226. $('.qs-s').removeClass('qs-hidden');
  227. $('.qs-q').addClass('qs-hidden');
  228. }
  229. if (panels.menuLevel[panels.menuLevel.L1] != undefined) {
  230. $(panels.menuLevel[panels.menuLevel.L1]).trigger('click');
  231. }
  232. $('.queryConditionsContainer').html('');
  233. });
  234. $("#cdts-ctrl").click(function(e) {
  235. var notDisplayCdts = $(this).find('img').eq(0).hasClass('qs-hidden');
  236. if (notDisplayCdts) {
  237. $(this).find('img').eq(0).removeClass('qs-hidden');
  238. $(this).find('img').eq(1).addClass('qs-hidden');
  239. $('.q-s-type').addClass('qs-hidden');
  240. } else {
  241. $(this).find('img').eq(1).removeClass('qs-hidden');
  242. $(this).find('img').eq(0).addClass('qs-hidden');
  243. $('.q-s-type').removeClass('qs-hidden');
  244. }
  245. });
  246. }
  247. panels.loadPanel = function(htmlUrl, title) {
  248. let _title = title;
  249. $.ajax({
  250. url: htmlUrl,
  251. success: function(htmlContext) {
  252. panels.createConditionPanel(htmlContext, _title);
  253. },
  254. error: function() {
  255. layer.msg('功能未实现!', {
  256. icon: 7
  257. });
  258. }
  259. });
  260. }
  261. panels.createChart = function(xAxis, data, title, subTitle, xTypeName, yTypeName, typeOfECharts) {
  262. if (data.length == 0) return;
  263. let xAxisData = [];
  264. for (let val in data[0]) {
  265. xAxisData.push(data[0][val][xTypeName])
  266. }
  267. let seriesData = [];
  268. for (let i = 1; i < data.length; i++) {
  269. let series = {};
  270. series.name = xAxis[i - 1];
  271. series.type = typeOfECharts;
  272. series.data = [];
  273. for (let j = 0; j < data[i].length; j++) {
  274. series.data.push(parseFloat(data[i][j][yTypeName]));
  275. }
  276. seriesData.push(series);
  277. }
  278. const chartDivID = "statistics-Chart";
  279. const chartDom = "<div id='" + chartDivID + "' style='width:100%;min-height: 360px;height:80%;'></div>";
  280. $("#panel-result").html($(chartDom));
  281. const myChart = echarts.init(document.getElementById(chartDivID));
  282. // 指定图表的配置项和数据
  283. const option = {
  284. title: {
  285. text: title,
  286. subtext: subTitle,
  287. left: 'center',
  288. textStyle: {
  289. fontSize: '18px',
  290. color: '#177BA3',
  291. fontWeight: 'bold'
  292. }
  293. },
  294. tooltip: {},
  295. legend: {
  296. bottom: '0',
  297. left: 'right',
  298. data: xAxis,
  299. textStyle: {
  300. color: "#eee"
  301. }
  302. },
  303. toolbox: {
  304. feature: {
  305. magicType: {
  306. type: ['line', 'bar', 'stack', 'tiled'],
  307. title: ['折线图', '柱状图', '堆叠图', '平铺']
  308. },
  309. saveAsImage: { title: "保存图片" }
  310. }
  311. },
  312. xAxis: {
  313. data: xAxisData,
  314. name: xTypeName,
  315. axisLabel: {
  316. interval: 0,
  317. rotate: 30,
  318. formatter: function(value, index) {
  319. return value /* + 'mm'*/ ;
  320. },
  321. axisLine: {
  322. onZero: false,
  323. lineStyle: {
  324. color: "#fff"
  325. }
  326. },
  327. }
  328. },
  329. yAxis: {
  330. axisLine: {
  331. onZero: false,
  332. lineStyle: {
  333. color: "#fff"
  334. }
  335. },
  336. name: yTypeName
  337. },
  338. series: seriesData
  339. };
  340. // 使用刚指定的配置项和数据显示图表。
  341. myChart.setOption(option);
  342. return myChart;
  343. }
  344. panels.createMonitor = function() {
  345. if (panels.createMonitor.created == true) return;
  346. panels.createMonitor.created = true;
  347. /*
  348. document.body.onclick = function(e) {
  349. let tmp = "<div style='position:absolute;width:2px;height:2px;display:inline-block;left:" + e.pageX + "px;top:" + e.pageY + "px;z-index:9001;background-color:red;'></div>";
  350. $(tmp).appendTo($('body'));
  351. };
  352. document.body.mouseup = function(e) {
  353. let tmp = "<div style='position:absolute;width:2px;height:2px;display:inline-block;left:" + e.pageX + "px;top:" + e.pageY + "px;z-index:9001;background-color:green;'></div>";
  354. $(tmp).appendTo($('body'));
  355. };
  356. */
  357. function imitateClick(oElement, iClientX, iClientY) {
  358. var oEvent;
  359. if (document.createEventObject) { //For IE
  360. oEvent = document.createEventObject();
  361. oEvent.clientX = iClientX;
  362. oEvent.clientY = iClientY;
  363. oElement.fireEvent("onclick", oEvent);
  364. } else {
  365. oEvent = document.createEvent("MouseEvents");
  366. oEvent.initMouseEvent("click", true, true, window, 0, 0, 0, iClientX, iClientY);
  367. oElement.dispatchEvent(oEvent);
  368. }
  369. }
  370. panels.createMonitor.moniter = imitateClick;
  371. }
  372. panels.createPagesByFeatures = function(params) {
  373. panels.createMonitor();
  374. let subTitle = params.subTitle;
  375. let features = params.features;
  376. let count = params.count;
  377. let dataSourceName = params.dataSourceName;
  378. let dataSetName = params.dataSetName;
  379. if (features.length == 0) return;
  380. let tableNew = "<table id='THETABLEID' lay-filter='THETABLEID'></table>";
  381. const tableNewID = utils.guid();
  382. while (tableNew.indexOf('THETABLEID') > -1)
  383. tableNew = tableNew.replace('THETABLEID', tableNewID);
  384. let cols = [];
  385. for (const property in features[0].properties) {
  386. let tmpProperty = property.toUpperCase();
  387. if (tmpProperty.startsWith("SM") && tmpProperty != "SMID")
  388. continue;
  389. if (tmpProperty.startsWith("SS"))
  390. continue;
  391. cols.push({ field: property, title: property, sort: true, width: 80 });
  392. }
  393. let datas = [];
  394. for (let i in features) {
  395. datas.push(features[i].properties);
  396. }
  397. let tabControl = "<div class='layui-tab' lay-filter='resultTabControl' id='THETABCONTROLID'>" +
  398. "<ul class='layui-tab-title'></ul>" +
  399. "<div class='layui-tab-content'></div></div>";
  400. let tabControlID = utils.guid();
  401. tabControl = tabControl.replace('THETABCONTROLID', tabControlID);
  402. if ($('div[lay-filter="resultTabControl"]').length == 0) {
  403. $(tabControl).appendTo($("#panel-result"));
  404. }
  405. //$(tableNew).appendTo($("#" + tabControlID));
  406. layui.use('element', function() {
  407. let element = layui.element;
  408. element.render();
  409. let tabID = utils.guid();
  410. element.tabAdd('resultTabControl', {
  411. title: subTitle,
  412. content: tableNew //支持传入html
  413. ,
  414. id: tabID
  415. });
  416. layui.use('table', function() {
  417. let table = layui.table;
  418. table.render({
  419. elem: '#' + tableNewID,
  420. data: datas,
  421. page: true,
  422. "lay-size": 'sm',
  423. limit: 6,
  424. cols: [cols]
  425. });
  426. table.on('row(' + tableNewID + ')', function(obj) {
  427. Q.queryBySql(dataSetName, dataSourceName, "SMID = " + obj.data.SMID, 0, 10, function(result) {
  428. if (result.result == undefined) return;
  429. var smidInt = parseInt(result.result.features.features[0].properties["SMID"]);
  430. let IDs = [smidInt];
  431. let theLayer = maps.scene.layers.find(subTitle);
  432. if (IDs.length > 0) {
  433. theLayer.setSelection(IDs);
  434. /*
  435. theLayer.setObjsColor(IDs, colorYellow);
  436. var idColors = new Cesium.AssociativeArray();
  437. idColors.set(smidInt, colorYellow);
  438. theLayer.updateObjsColor(idColors);
  439. */
  440. let pos = result.result.features.features[0].geometry.coordinates.position;
  441. maps.scene.terrainProvider.visible = false;
  442. let center = Cesium.Cartesian3.fromDegrees(pos.x, pos.y, pos.z);
  443. cesiumLocateUtil.flyTo.flyToPoint(center, 30, -45, 200, 0.5, function() {
  444. let cesiumElem = $('.cesium-widget canvas')[0];
  445. panels.createMonitor.moniter(cesiumElem, $(cesiumElem).width() / 2, $(cesiumElem).height() / 2);
  446. });
  447. }
  448. });
  449. });
  450. });
  451. element.tabChange('resultTabControl', tabID);
  452. const thisTitle = $('.layui-layer-title');
  453. thisTitle.addClass("layui-layer-title-transparent");
  454. });
  455. }
  456. panels.createResultPanelWithChart = function(xAxis, data, title, subTitle, xTypeName, yTypeName, typeOfECharts, callback) {
  457. layui.use('layer', function() {
  458. let chart;
  459. let resizeCb = function(layerno) {
  460. if (chart == undefined) return;
  461. chart.resize();
  462. }
  463. panels.createPanelBase(title, resizeCb);
  464. chart = panels.createChart(xAxis, data, title, subTitle, xTypeName, yTypeName, typeOfECharts);
  465. if (callback != undefined) {
  466. callback();
  467. }
  468. });
  469. }
  470. panels.createPanelBase = function(title, resizeCb) {
  471. //兼容两个页面
  472. let pc = $("#panel-condition");
  473. let theTarget;
  474. if (pc.length > 0) {
  475. theTarget = pc.parent();
  476. } else {
  477. theTarget = $(".q-s-type");
  478. }
  479. const conditionLeft = parseInt(theTarget.css("left").replace('px', ''));
  480. const conditionWidth = parseInt(theTarget.width());
  481. const conditionHeight = parseInt(theTarget.height());
  482. const conditionTop = parseInt(theTarget.css("top").replace('px', ''));
  483. let x = conditionLeft + conditionWidth + 5 + "px";
  484. let y = conditionTop + conditionHeight + 10 + "px";
  485. let offset = ['65px'];
  486. if (pc.length === 0) {
  487. x = conditionLeft + "px";
  488. offset = [y, x]
  489. }
  490. panels.lastResultPanelIndex = layer.open({
  491. id: "panel-result",
  492. anim: 3,
  493. area: ['412px', '400px'],
  494. title: "<span class='q-title-in-Sub-img'></span><span class='q-title-in-Sub-title'>" + title + "</span>",
  495. skin: 'layui-ext-coolskin',
  496. offset: offset,
  497. shade: 0,
  498. type: 1,
  499. maxmin: true,
  500. resizing: function(layero) {
  501. if (resizeCb)
  502. resizeCb(layero);
  503. },
  504. success: function(layero, index) {}
  505. });
  506. }
  507. panels.createResultPanelWithDataGrid = function(params, callback) {
  508. layui.use('layer', function() {
  509. if (params.features.length == 0) {
  510. layui.layer.msg(params.title + "下" + params.subTitle + '查询无结果。<br>请重新设置查询条件!');
  511. return -1;
  512. }
  513. panels.createPanelBase(params.title);
  514. panels.createPagesByFeatures(params);
  515. if (callback != undefined) {
  516. callback();
  517. }
  518. });
  519. }
  520. panels.createConditionPanel = function(htmlContext, title, callback) {
  521. layui.use('layer', function() {
  522. const layer = layui.layer;
  523. layer.close(panels.layerTreePanelIndex);
  524. function open() {
  525. panels.lastConditionPanelIndex = layer.open({
  526. id: "panel-condition",
  527. anim: 1,
  528. area: "380px",
  529. title: title,
  530. skin: 'layui-ext-coolskin',
  531. offset: ['65px', panels.SideWidth() + 5 + "px"],
  532. shade: 0,
  533. type: 1,
  534. content: htmlContext, //这里content是一个DOM,注意:最好该元素要存放在body最外层,否则可能被其它的相对元素所影响
  535. cancel: function() {
  536. if (panels.lastResultPanelIndex != undefined) {
  537. layer.close(panels.lastResultPanelIndex);
  538. }
  539. },
  540. success: function(layero, index) {}
  541. });
  542. layui.use(['form'], function() {
  543. let form = layui.form;
  544. form.render();
  545. });
  546. if (callback != undefined) {
  547. callback();
  548. }
  549. }
  550. if (panels.lastResultPanelIndex != undefined) {
  551. layer.close(panels.lastResultPanelIndex);
  552. }
  553. if (panels.lastConditionPanelIndex != undefined) {
  554. layer.close(panels.lastConditionPanelIndex);
  555. }
  556. setTimeout(open, 500);
  557. });
  558. }
  559. panels.SideWidth = function() {
  560. return $(".layui-side ").width();
  561. }
  562. panels.loadLayerTreePanelByDom = function(domID, callback) {
  563. layui.use('layer', function() {
  564. const layer = layui.layer;
  565. panels.layerTreePanelIndex = layer.open({
  566. anim: 3,
  567. id: 'layerTreePanel',
  568. area: "280px",
  569. skin: 'layui-ext-coolskin',
  570. title: ["全部图层", 'font-size:14px;'],
  571. offset: ['65px', panels.SideWidth() + 5 + "px"],
  572. shade: 0,
  573. type: 1,
  574. content: $('#' + domID), //这里content是一个DOM,注意:最好该元素要存放在body最外层,否则可能被其它的相对元素所影响
  575. cancel: function() {},
  576. success: function(layero, index) {}
  577. });
  578. if (callback != undefined) {
  579. callback();
  580. }
  581. });
  582. }
  583. panels.clear = function(panelID) {
  584. if (panelID == undefined) {
  585. $(".r-panel").remove();
  586. } else {
  587. $("#" + panelID).remove();
  588. }
  589. }
  590. maps.loadLayerTrees = function(layers) {
  591. const allLayers = [];
  592. let nodeImage = {
  593. title: "影像图层",
  594. id: "影像图层",
  595. layer: maps.mapViewer.imageryLayers.get(1),
  596. checked: true
  597. };
  598. allLayers.push(nodeImage);
  599. for (let index = 0; index < layers.length; index++) {
  600. const layer = layers[index];
  601. if (layer._isSct) continue;
  602. const nodeLayerInScene = {
  603. title: layer.name,
  604. id: layer.name,
  605. layer: layer,
  606. checked: layer.visible
  607. };
  608. allLayers.push(nodeLayerInScene);
  609. }
  610. $('body').append("<div id='layerTree' ></div>");
  611. let openThePanel = function() {
  612. if ($("#layerTree").html().length > 0) {
  613. panels.loadLayerTreePanelByDom('layerTree');
  614. return;
  615. }
  616. panels.loadLayerTreePanelByDom('layerTree', function() {
  617. layui.use('tree', function() {
  618. const tree = layui.tree;
  619. tree.render({
  620. elem: '#layerTree',
  621. data: allLayers,
  622. showCheckbox: true,
  623. showLine: true,
  624. oncheck: function(obj) {
  625. if (obj.data.layer == undefined) {
  626. return;
  627. }
  628. if (obj.data.layer.isFirstLoad == undefined) {
  629. obj.data.layer.isFirstLoad = false;
  630. return;
  631. }
  632. if (obj.data.layer.imageryProvider != undefined) {
  633. obj.data.layer.show = obj.checked;
  634. } else if (obj.data.layer.layer3DType == "TerrainFileLayer") {
  635. maps.scene.terrainProvider.visible = obj.checked;
  636. } else {
  637. let lyr = maps.scene.layers.find(obj.data.layer.name);
  638. lyr.visible = obj.checked;
  639. }
  640. }
  641. });
  642. });
  643. });
  644. }
  645. panels.openLayerTreePanel = openThePanel;
  646. //openThePanel();
  647. }
  648. maps.loadSmScene = function() {
  649. $.get(URL_CONFIG.SM_SCENE_LAYERS_01,
  650. function(lyrs) {
  651. mapDatas.getFeatureInfo();
  652. maps.layersInScene = lyrs;
  653. maps.loadLayerTrees(lyrs);
  654. for (let index = 0; index < lyrs.length; index++) {
  655. const lyr = lyrs[index];
  656. lyr.guid = utils.guid();
  657. if (lyr.layer3DType === "OSGBLayer") {
  658. let sctUrl = URL_CONFIG.SM_SCENE_DATA + lyr.name + "/config"
  659. let promise = maps.scene.addS3MTilesLayerByScp(sctUrl, { name: lyr.name });
  660. promise.then(function(layer) {
  661. let colorYellow = new Cesium.Color(1.0, 1.0, 0.0, 1.0);
  662. layer.selectedColor = colorYellow;
  663. layer.selectColorType = Cesium.SelectColorType.SILHOUETTE_EDGE;
  664. layer.selectedLineColor = colorYellow;
  665. let dat = mapDatas.getDataInfoByName(layer.name);
  666. if (dat == undefined) return;
  667. console.log(dat);
  668. layer.setQueryParameter({
  669. url: CONST_VALUES.GX_Datas_BaseUrl,
  670. dataSourceName: dat.dataSourceName,
  671. dataSetName: dat.dataSetName,
  672. keyWord: 'SmID'
  673. });
  674. });
  675. } else if (lyr.layer3DType === "TerrainFileLayer") {
  676. const sctUrl = URL_CONFIG.SM_SCENE_DATA + lyr.name
  677. maps.mapViewer.terrainProvider = new Cesium.CesiumTerrainProvider({
  678. url: sctUrl,
  679. isSct: true,
  680. invisibility: true
  681. });
  682. const x = (lyr.bounds.left + lyr.bounds.right) / 2;
  683. const y = (lyr.bounds.top + lyr.bounds.bottom) / 2;
  684. maps.scene.camera.setView({
  685. destination: new Cesium.Cartesian3.fromDegrees(x, y, 5000)
  686. });
  687. }
  688. }
  689. window.firstLoad = true;
  690. });
  691. }
  692. $(document).ready(function() {
  693. layui.use(['layer'], function() {
  694. let layer = layui.layer;
  695. layer.config({
  696. extend: 'cool/cool.css'
  697. });
  698. });
  699. if (typeof Cesium !== 'undefined') {
  700. onload(Cesium);
  701. }
  702. bs.registerNavMenus();
  703. if (location.pathname.indexOf("map1") >= 0) {
  704. panels.addPanels("basicToolbar");
  705. panels.addPanels("spatialToolBar");
  706. }
  707. if (location.pathname.indexOf("start") >= 0) {
  708. basicToolbarMethod();
  709. spatialToolBarMethod();
  710. }
  711. });
  712. panels.addPanels = function(panelName) {
  713. $.ajax({
  714. success: function(result) {
  715. $('body').append($(result));
  716. },
  717. error: function(e) {
  718. console.error(e);
  719. },
  720. url: "/static/maps/panels/" + panelName + ".html"
  721. });
  722. }
  723. function createTooltip(frameDiv) {
  724. let tooltip = function(frameDiv) {
  725. let div = document.createElement('DIV');
  726. div.className = "twipsy right";
  727. let arrow = document.createElement('DIV');
  728. arrow.className = "twipsy-arrow";
  729. div.appendChild(arrow);
  730. let title = document.createElement('DIV');
  731. title.className = "twipsy-inner";
  732. div.appendChild(title);
  733. this._div = div;
  734. this._title = title;
  735. this.message = '';
  736. // add to frame div and display coordinates
  737. frameDiv.appendChild(div);
  738. let that = this;
  739. div.onmousemove = function(evt) {
  740. that.showAt({ x: evt.clientX, y: evt.clientY }, that.message);
  741. };
  742. };
  743. tooltip.prototype.setVisible = function(visible) {
  744. this._div.style.display = visible ? 'block' : 'none';
  745. };
  746. tooltip.prototype.showAt = function(position, message) {
  747. if (position && message) {
  748. this.setVisible(true);
  749. this._title.innerHTML = message;
  750. this._div.style.left = position.x + 10 + "px";
  751. this._div.style.top = (position.y - this._div.clientHeight / 2) + "px";
  752. this.message = message;
  753. }
  754. };
  755. return new tooltip(frameDiv);
  756. }
  757. ///basicToolbarMethod
  758. function basicToolbarMethod() {
  759. const viewer = maps.mapViewer;
  760. const widget = viewer.cesiumWidget;
  761. var clampMode = 0;
  762. var handlerDis, handlerArea, handlerHeight;
  763. //初始化测量距离
  764. handlerDis = new Cesium.MeasureHandler(viewer, Cesium.MeasureMode.Distance, clampMode);
  765. //注册测距功能事件
  766. handlerDis.measureEvt.addEventListener(function(result) {
  767. var dis = Number(result.distance);
  768. var distance = dis > 1000 ? (dis / 1000).toFixed(2) + 'km' : dis.toFixed(2) + 'm';
  769. handlerDis.disLabel.text = '距离:' + distance;
  770. });
  771. handlerDis.activeEvt.addEventListener(function(isActive) {
  772. if (isActive == true) {
  773. viewer.enableCursorStyle = false;
  774. viewer._element.style.cursor = '';
  775. $('body').removeClass('measureCur').addClass('measureCur');
  776. } else {
  777. viewer.enableCursorStyle = true;
  778. $('body').removeClass('measureCur');
  779. }
  780. });
  781. //初始化测量面积
  782. handlerArea = new Cesium.MeasureHandler(viewer, Cesium.MeasureMode.Area, clampMode);
  783. handlerArea.measureEvt.addEventListener(function(result) {
  784. var mj = Number(result.area);
  785. var area = mj > 1000000 ? (mj / 1000000).toFixed(2) + 'km²' : mj.toFixed(2) + '㎡'
  786. handlerArea.areaLabel.text = '面积:' + area;
  787. });
  788. handlerArea.activeEvt.addEventListener(function(isActive) {
  789. if (isActive == true) {
  790. viewer.enableCursorStyle = false;
  791. viewer._element.style.cursor = '';
  792. $('body').removeClass('measureCur').addClass('measureCur');
  793. } else {
  794. viewer.enableCursorStyle = true;
  795. $('body').removeClass('measureCur');
  796. }
  797. });
  798. //初始化测量高度
  799. handlerHeight = new Cesium.MeasureHandler(viewer, Cesium.MeasureMode.DVH);
  800. handlerHeight.measureEvt.addEventListener(function(result) {
  801. var distance = result.distance > 1000 ? (result.distance / 1000).toFixed(2) + 'km' : result.distance + 'm';
  802. var vHeight = result.verticalHeight > 1000 ? (result.verticalHeight / 1000).toFixed(2) + 'km' : result.verticalHeight + 'm';
  803. var hDistance = result.horizontalDistance > 1000 ? (result.horizontalDistance / 1000).toFixed(2) + 'km' : result.horizontalDistance + 'm';
  804. handlerHeight.disLabel.text = '空间距离:' + distance;
  805. handlerHeight.vLabel.text = '垂直高度:' + vHeight;
  806. handlerHeight.hLabel.text = '水平距离:' + hDistance;
  807. });
  808. handlerHeight.activeEvt.addEventListener(function(isActive) {
  809. if (isActive == true) {
  810. viewer.enableCursorStyle = false;
  811. viewer._element.style.cursor = '';
  812. $('body').removeClass('measureCur').addClass('measureCur');
  813. } else {
  814. viewer.enableCursorStyle = true;
  815. $('body').removeClass('measureCur');
  816. }
  817. });
  818. //椭球贴地面积
  819. function calcClampValue(positions) {
  820. var lonlat = [];
  821. var value = 0;
  822. for (var i = 0; i < positions.length; i++) {
  823. var cartographic = Cesium.Cartographic.fromCartesian(positions[i]);
  824. var lon = Cesium.Math.toDegrees(cartographic.longitude);
  825. var lat = Cesium.Math.toDegrees(cartographic.latitude);
  826. lonlat.push(lon, lat);
  827. }
  828. var gemetry = new Cesium.PolygonGeometry.fromPositions({
  829. positions: Cesium.Cartesian3.fromDegreesArray(lonlat)
  830. });
  831. return value;
  832. }
  833. //椭球贴地距离
  834. function calcClampDistance(positions) {
  835. var lonlat = [];
  836. var value = 0;
  837. for (var i = 0; i < positions.length; i++) {
  838. var cartographic = Cesium.Cartographic.fromCartesian(positions[i]);
  839. var lon = Cesium.Math.toDegrees(cartographic.longitude);
  840. var lat = Cesium.Math.toDegrees(cartographic.latitude);
  841. lonlat.push(lon, lat);
  842. }
  843. return value;
  844. }
  845. function calcAreaWithoutHeight(positions) {
  846. var totalLon = 0;
  847. for (var i = 0; i < positions.length; i++) {
  848. var cartographic = Cesium.Cartographic.fromCartesian(positions[i]);
  849. var lon = Cesium.Math.toDegrees(cartographic.longitude);
  850. totalLon += lon;
  851. }
  852. var dh = Math.round((totalLon / positions.length + 6) / 6); //带号
  853. var centralMeridian = dh * 6 - 3;
  854. //高斯投影
  855. var projection = new Cesium.CustomProjection({
  856. name: "tmerc",
  857. centralMeridian: centralMeridian,
  858. primeMeridian: 0,
  859. standardParallel_1: 0,
  860. standardParallel_2: 0,
  861. eastFalse: 500000.0,
  862. northFalse: 0.0,
  863. semimajorAxis: 6378137,
  864. inverseFlattening: 298.257222101
  865. });
  866. var cartesians = [];
  867. for (var i = 0; i < positions.length; i++) {
  868. var cartographic = Cesium.Cartographic.fromCartesian(positions[i]);
  869. var cartesian = projection.project(cartographic);
  870. cartesians.push(cartesian);
  871. }
  872. cartesians.push(cartesians[0]); //首尾相接
  873. var value = Cesium.getPreciseArea(cartesians, "China2000", centralMeridian, dh, 1);
  874. return value;
  875. }
  876. clampMode = 0;
  877. handlerArea.clampMode = 0;
  878. handlerDis.clampMode = 0;
  879. $('#tool-dis').click(function() {
  880. deactiveAll();
  881. handlerDis && handlerDis.activate();
  882. });
  883. $('#tool-area').click(function() {
  884. deactiveAll();
  885. handlerArea && handlerArea.activate();
  886. });
  887. $('#tool-height').click(function() {
  888. deactiveAll();
  889. handlerHeight && handlerHeight.activate();
  890. });
  891. $('#tool-clear').click(function() {
  892. clearAll();
  893. });
  894. function clearAll() {
  895. handlerDis && handlerDis.clear();
  896. handlerArea && handlerArea.clear();
  897. handlerHeight && handlerHeight.clear();
  898. }
  899. function deactiveAll() {
  900. handlerDis && handlerDis.deactivate();
  901. handlerArea && handlerArea.deactivate();
  902. handlerHeight && handlerHeight.deactivate();
  903. }
  904. $('#tool-fullscreen').click(function() {
  905. toggleFullScreen();
  906. });
  907. function FullScreen(el) {
  908. var isFullscreen = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen;
  909. if (!isFullscreen) { //进入全屏,多重短路表达式
  910. (el.requestFullscreen && el.requestFullscreen()) ||
  911. (el.mozRequestFullScreen && el.mozRequestFullScreen()) ||
  912. (el.webkitRequestFullscreen && el.webkitRequestFullscreen()) || (el.msRequestFullscreen && el.msRequestFullscreen());
  913. } else { //退出全屏,三目运算符
  914. document.exitFullscreen ? document.exitFullscreen() :
  915. document.mozCancelFullScreen ? document.mozCancelFullScreen() :
  916. document.webkitExitFullscreen ? document.webkitExitFullscreen() : '';
  917. }
  918. }
  919. function toggleFullScreen() {
  920. FullScreen(document.body);
  921. }
  922. }
  923. function afterQueryCompleted(features) {
  924. let selectedFeatures = features;
  925. let IDs = [];
  926. const viewer = maps.mapViewer;
  927. viewer.entities.removeAll();
  928. for (let i = 0; i < selectedFeatures.length; i++) {
  929. let value = selectedFeatures[i].fieldValues["0"];
  930. let feature = selectedFeatures[i];
  931. for (let j = 0; j < feature.fieldNames.length; j++) {
  932. let index = j.toString();
  933. if (j == 0) {
  934. var des = '<table class="cesium-infoBox-defaultTable"><tbody>' + '<tr><th>' + selectedFeatures[i].fieldNames["0"] + '</th><td>' + selectedFeatures[i].fieldValues["0"] + '</td></tr>';
  935. } else if (j == feature.fieldNames.length - 1) {
  936. des += '<tr><th>' + selectedFeatures[i].fieldNames[index] + '</th><td>' + selectedFeatures[i].fieldValues[index] + '</td></tr>' + "</tbody></table>";
  937. } else {
  938. des += '<tr><th>' + selectedFeatures[i].fieldNames[index] + '</th><td>' + selectedFeatures[i].fieldValues[index] + '</td></tr>';
  939. }
  940. }
  941. let wIndex = selectedFeatures[i].fieldNames.indexOf("SMSDRIW");
  942. let eIndex = selectedFeatures[i].fieldNames.indexOf("SMSDRIE");
  943. let nIndex = selectedFeatures[i].fieldNames.indexOf("SMSDRIN");
  944. let sIndex = selectedFeatures[i].fieldNames.indexOf("SMSDRIS");
  945. let startElevationIndex = selectedFeatures[i].fieldNames.indexOf("SSSTART_ELEVATION");
  946. let endElevationIndex = selectedFeatures[i].fieldNames.indexOf("SSEND_ELEVATION");
  947. let x = (parseFloat(selectedFeatures[i].fieldValues[wIndex]) + parseFloat(selectedFeatures[i].fieldValues[eIndex])) / 2;
  948. let y = (parseFloat(selectedFeatures[i].fieldValues[nIndex]) + parseFloat(selectedFeatures[i].fieldValues[sIndex])) / 2;
  949. let elevation = (parseFloat(selectedFeatures[i].fieldValues[startElevationIndex]) + parseFloat(selectedFeatures[i].fieldValues[endElevationIndex])) / 2;
  950. viewer.entities.add({
  951. position: Cesium.Cartesian3.fromDegrees(x, y, elevation),
  952. billboard: {
  953. image: '/static/maps/images/pointer.png',
  954. width: 30,
  955. height: 40
  956. },
  957. description: des
  958. });
  959. IDs.push(parseInt(value) + 11);
  960. }
  961. let theLayer = maps.scene.layers.find(spatialToolBarMethod.SpatialQuery.currentLayerName);
  962. if (IDs.length > 0) {
  963. theLayer.setSelection(IDs);
  964. }
  965. }
  966. ///spatialToolBarMethod
  967. function spatialToolBarMethod() {
  968. $('#tool-layerCtrl').click(function(e) {
  969. panels.openLayerTreePanel();
  970. });
  971. $('#tool-kw').click(function(e) {
  972. SpatialQuery.current = false;
  973. DoKW(false);
  974. });
  975. $('#tool-kwLine').click(function(e) {
  976. SpatialQuery.current = false;
  977. DoKW(true);
  978. });
  979. $('#tool-SpatialQuery').click(function(e) {
  980. SpatialQuery();
  981. });
  982. const viewer = maps.mapViewer;
  983. const tooltip = createTooltip(viewer._element);
  984. function SpatialQuery() {
  985. SpatialQuery.current = true;
  986. DoKW(false);
  987. }
  988. spatialToolBarMethod.SpatialQuery = SpatialQuery;
  989. function DoKW(isLine) {
  990. DoKW.isLine = isLine;
  991. if (DoKW.registered === true) {
  992. if (isLine !== true) {
  993. DoKW.handlerPolygonKW.activate();
  994. } else {
  995. DoKW.handlerLinenKW.activate();
  996. }
  997. return;
  998. }
  999. document.getElementById("tool-clear").onclick = function() {
  1000. if (DoKW.handlerPolygonKW)
  1001. DoKW.handlerPolygonKW.clear();
  1002. if (DoKW.handlerLinenKW)
  1003. DoKW.handlerLinenKW.clear();
  1004. maps.scene.globe.removeAllExcavationRegion();
  1005. if (DoKW.registered === true) {
  1006. DoKW.endDraw();
  1007. DoKW.deactivate();
  1008. maps.mapViewer.entities.removeAll();
  1009. maps.scene.globe.removeAllExcavationRegion();
  1010. }
  1011. };
  1012. const handlerPolygonKW = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Polygon, 3);
  1013. const handlerLinenKW = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Line, 3);
  1014. let funActiveEvt = function(isActive) {
  1015. if (isActive == true) {
  1016. viewer.enableCursorStyle = false;
  1017. viewer._element.style.cursor = '';
  1018. $('body').removeClass('drawCur').addClass('drawCur');
  1019. } else {
  1020. viewer.enableCursorStyle = true;
  1021. $('body').removeClass('drawCur');
  1022. }
  1023. };
  1024. handlerPolygonKW.activeEvt.addEventListener(funActiveEvt);
  1025. handlerLinenKW.activeEvt.addEventListener(funActiveEvt);
  1026. let funMovingEvt = function(windowPosition) {
  1027. if (windowPosition.x < 200 && windowPosition.y < 150) {
  1028. tooltip.setVisible(false);
  1029. return;
  1030. }
  1031. if (handlerPolygonKW.isDrawing || handlerLinenKW.isDrawing) {
  1032. tooltip.showAt(windowPosition, '<p>点击确定开挖区域中间点</p><p>右键单击结束绘制</p>');
  1033. } else {
  1034. tooltip.showAt(windowPosition, '<p>点击绘制开挖区域第一个点</p><p>右键单击结束绘制</p>');
  1035. }
  1036. };
  1037. function getSpatialQueryGeometry(result) {
  1038. let positions = result.object.positions;
  1039. let geometries = [];
  1040. for (let i = 0; i < positions.length; i++) {
  1041. let position = positions[i];
  1042. let cartographic = Cesium.Cartographic.fromCartesian(position);
  1043. let longitude = Cesium.Math.toDegrees(cartographic.longitude);
  1044. let latitude = Cesium.Math.toDegrees(cartographic.latitude);
  1045. let queryPoint = { // 查询点对象
  1046. x: longitude,
  1047. y: latitude
  1048. };
  1049. geometries.push(queryPoint)
  1050. }
  1051. sqatialQueryFromSvr(geometries);
  1052. }
  1053. handlerPolygonKW.movingEvt.addEventListener(funMovingEvt);
  1054. handlerLinenKW.movingEvt.addEventListener(funMovingEvt);
  1055. let funDrawEvt = function(result) {
  1056. if (result.object.length > 0) {
  1057. result.object.positions = result.object;
  1058. }
  1059. if (DoKW.handlerPolygonKW)
  1060. DoKW.handlerPolygonKW.clear();
  1061. if (DoKW.handlerLinenKW)
  1062. DoKW.handlerLinenKW.clear();
  1063. if (!result.object.positions) {
  1064. DoKW.deactivate();
  1065. if (DoKW.isLine === false) {
  1066. tooltip.showAt(result, '<p>请绘制正确的多边形</p>');
  1067. DoKW.handlerPolygonKW.activate();
  1068. } else {
  1069. tooltip.showAt(result, '<p>请绘制正确的线路</p>');
  1070. DoKW.handlerLinenKW.activate();
  1071. }
  1072. return;
  1073. }
  1074. let array = [].concat(result.object.positions);
  1075. if (array.length < 2) return;
  1076. tooltip.setVisible(false);
  1077. if (SpatialQuery.current === true) {
  1078. getSpatialQueryGeometry(result);
  1079. }
  1080. let positions = [];
  1081. if (!DoKW.isLine) {
  1082. for (let i = 0, len = array.length; i < len; i++) {
  1083. let cartographic = Cesium.Cartographic.fromCartesian(array[i]);
  1084. let longitude = Cesium.Math.toDegrees(cartographic.longitude);
  1085. let latitude = Cesium.Math.toDegrees(cartographic.latitude);
  1086. let h = cartographic.height;
  1087. if (positions.indexOf(longitude) == -1 && positions.indexOf(latitude) == -1) {
  1088. positions.push(longitude);
  1089. positions.push(latitude);
  1090. positions.push(h);
  1091. }
  1092. }
  1093. } else {
  1094. positions = DoKW.lineBuffer(array);
  1095. }
  1096. let dep = 1000;
  1097. viewer.scene.globe.removeAllExcavationRegion();
  1098. viewer.scene.globe.addExcavationRegion({
  1099. name: 'ggg',
  1100. position: positions,
  1101. height: dep,
  1102. transparent: false
  1103. });
  1104. DoKW.deactivate();
  1105. DoKW.endDraw();
  1106. };
  1107. handlerPolygonKW.drawEvt.addEventListener(funDrawEvt);
  1108. handlerLinenKW.drawEvt.addEventListener(funDrawEvt);
  1109. if (isLine)
  1110. handlerLinenKW.activate();
  1111. else
  1112. handlerPolygonKW.activate();
  1113. DoKW.registered = true;
  1114. DoKW.handlerPolygonKW = handlerPolygonKW;
  1115. DoKW.handlerLinenKW = handlerLinenKW;
  1116. }
  1117. spatialToolBarMethod.DoKW = DoKW;
  1118. DoKW.deactivate = function() {
  1119. if (DoKW.handlerPolygonKW.polygon != undefined)
  1120. DoKW.handlerPolygonKW.polygon.show = false;
  1121. if (DoKW.handlerPolygonKW.polyline != undefined)
  1122. DoKW.handlerPolygonKW.polyline.show = false;
  1123. DoKW.handlerPolygonKW.deactivate();
  1124. if (DoKW.handlerLinenKW.polygon != undefined)
  1125. DoKW.handlerLinenKW.polygon.show = false;
  1126. if (DoKW.handlerLinenKW.polyline != undefined)
  1127. DoKW.handlerLinenKW.polyline.show = false;
  1128. DoKW.handlerLinenKW.deactivate();
  1129. }
  1130. DoKW.endDraw = function() {
  1131. tooltip.setVisible(false);
  1132. viewer.enableCursorStyle = true;
  1133. $('body').removeClass('drawCur');
  1134. DoKW.deactivate();
  1135. }
  1136. DoKW.lineBuffer = function(array) {
  1137. let positions = [];
  1138. let lonLats = [];
  1139. let maxHeight = -1;
  1140. for (let i = 0, len = array.length; i < len; i++) {
  1141. let cartographic = Cesium.Cartographic.fromCartesian(array[i]);
  1142. let longitude = Cesium.Math.toDegrees(cartographic.longitude);
  1143. let latitude = Cesium.Math.toDegrees(cartographic.latitude);
  1144. let h = cartographic.height;
  1145. if (h > maxHeight) maxHeight = h;
  1146. //let h1 = cartographic1.height;
  1147. lonLats.push([longitude, latitude]);
  1148. }
  1149. let polygon = turf.lineString(lonLats, { name: 'lineString' });
  1150. let buffered = turf.buffer(polygon, 0.1, { units: 'kilometers', steps: 1 });
  1151. for (let i = 0; i < buffered.geometry.coordinates[0].length; i++) {
  1152. let coordinate = buffered.geometry.coordinates[0][i];
  1153. positions.push(coordinate[0]);
  1154. positions.push(coordinate[1]);
  1155. positions.push(maxHeight);
  1156. }
  1157. return positions;
  1158. }
  1159. function processCompleted(features) { afterQueryCompleted(features); }
  1160. function sqatialQueryFromSvr(queryPoints) {
  1161. maps.mapViewer.entities.removeAll();
  1162. let lyrs = CONST_VALUES.GX_Datas;
  1163. //debugger;
  1164. let lyrsSelect = '<div class="layui-form" lay-filter="lyrsSelectDiv"><div class="layui-form-item">' +
  1165. '<label class="layui-form-label">选择图层</label><div class="layui-input-block">';
  1166. let listStr = '<input type="radio" checked name=\"GX\" value=\"VALUE\" title="TEXT"/ lyrName3D="LAYER3D">';
  1167. for (let index = 0; index < lyrs.length; index++) {
  1168. const lyr = lyrs[index];
  1169. //debugger;
  1170. if (lyr.name.indexOf("管线") < 0)
  1171. continue;
  1172. let dom = listStr.replace('VALUE', lyr.dataSourceName + ':' + lyr.dataSetName2D);
  1173. dom = dom.replace('TEXT', lyr.name);
  1174. dom = dom.replace('LAYER3D', lyr.dataSetName + "@" + lyr.dataSourceName);
  1175. lyrsSelect += dom;
  1176. }
  1177. lyrsSelect += '</div></div></div>';
  1178. layui.use('layer', function() {
  1179. let layer = layui.layer;
  1180. layer.open({
  1181. id: "panel-layerSelect",
  1182. type: 1,
  1183. area: ["300px", "220px"],
  1184. btn: ['确定'],
  1185. title: "请选择图层",
  1186. skin: 'layui-ext-coolskin',
  1187. content: lyrsSelect, //这里content是一个DOM,注意:最好该元素要存放在body最外层,否则可能被其它的相对元素所影响
  1188. cancel: function(index, layero) {
  1189. layer.close(index)
  1190. },
  1191. yes: function(e) {
  1192. let gx = $('input[name="GX"]:checked')[0].value;
  1193. SpatialQuery.currentLayerName = $('input[name="GX"]:checked').attr("title");
  1194. let queryObj = {
  1195. "getFeatureMode": "SPATIAL",
  1196. "spatialQueryMode": "CONTAIN",
  1197. "datasetNames": [gx],
  1198. "geometry": {
  1199. points: queryPoints,
  1200. type: "REGION"
  1201. }
  1202. };
  1203. let queryData = JSON.stringify(queryObj); // 转化为JSON字符串作为查询参数
  1204. let dataUrl = CONST_VALUES.GX_Datas_BaseUrl + "/featureResults.rjson?returnContent=true";
  1205. $.ajax({
  1206. type: "post",
  1207. url: dataUrl,
  1208. data: queryData,
  1209. success: function(result) {
  1210. let resultObj = JSON.parse(result);
  1211. if (resultObj.featureCount > 0) {
  1212. processCompleted(resultObj.features);
  1213. }
  1214. },
  1215. error: function(msg) {
  1216. console.log(msg);
  1217. }
  1218. })
  1219. }
  1220. });
  1221. layui.use(['form'], function() {
  1222. let form = layui.form;
  1223. form.render();
  1224. });
  1225. });
  1226. }
  1227. function processFailed(e) {
  1228. layui.use('layer', function() {
  1229. let layer = layui.layer;
  1230. layer.msg(e.error.errorMsg);
  1231. });
  1232. }
  1233. }
  1234. /*
  1235. * @Author: 苹果园dog
  1236. * @Date: 2020-10-31 21:50:33
  1237. * @LastEditTime: 2020-11-05 23:06:14
  1238. * @LastEditors: Please set LastEditors
  1239. * @Description: Cesium 的各种定位方法汇总,只列出项目中经常使用的,如果不够灵活,可直接调用Cesium官方API,也很方便。
  1240. * Cesium的定位从效果上包含两种:直接定位、飞行定位。在方法封装上,本狗姑且将直接定位分类为zoomTo系列,飞行定位分类flyTo。
  1241. * 定位的对象上包括:坐标点、矩形范围、entities、3dtiles、gltf、kml、geojson、影像、地形、geometry
  1242. * Cesium的定位主要是使用Camera对象和Viewer对象,Viewer的定位zoomTo,flyTo等方法是较高级别的函数,可以定位到Entity、3dtiles、DataSource等添加到三维球上显示的实体,
  1243. * Viewer的定位方法内部都是调用Camera的相关定位方法,针对不同的定位对象,通过一些列计算得出传入实体的合适定位范围和摄像机视角,然后定位,使用起来很方便。
  1244. * Camera的flyTo、flyToBoundingSphere、lookat、setView等方法是较低级别函数,通过定位坐标和角度参数的传入,精细化控制定位视角,灵活。
  1245. * @FilePath: \web\cesiumS\cesium\cesium\mytest\朝花夕拾\定位\cesiumLocateUtil.js
  1246. */
  1247. var cesiumLocateUtil = {
  1248. zoomTo: {
  1249. },
  1250. flyTo: {
  1251. /**
  1252. * @description: 飞行定位到一个笛卡尔空间直角坐标点位置
  1253. * @param {Cartesian3} destination 目标点 Cartesian3
  1254. * @param {Number} heading 默认=0.0 偏航角 正北,由正北向东偏向为正
  1255. * @param {*} pitch =-90 俯仰角 垂直向下, ENU局部坐标系中XY平面的旋转角度,平面下为负,上为正,
  1256. * @param {*} range =0.0 距目标点距离
  1257. * @param {*} duration =3 持续时间
  1258. * @param {*} callBack =null 回调函数,定位完成后执行
  1259. */
  1260. flyToPoint: function(destination, heading = 0.0, pitch = -90, range = 0.0, duration = 3, callBack = null) {
  1261. if (!maps.mapViewer) {
  1262. console.log('三维球未初始化!');
  1263. return;
  1264. }
  1265. if (!destination) {
  1266. console.log('定位目标点不对!');
  1267. return;
  1268. }
  1269. var boundingSphere = new Cesium.BoundingSphere(destination, 0.0);
  1270. return maps.mapViewer.camera.flyToBoundingSphere(boundingSphere, {
  1271. duration: duration,
  1272. maximumHeight: undefined,
  1273. complete: function() {
  1274. if (callBack) {
  1275. callBack();
  1276. } else {
  1277. console.log('定位失败!');
  1278. }
  1279. },
  1280. cancel: function() {
  1281. console.log('定位取消!');
  1282. },
  1283. offset: {
  1284. heading: Cesium.Math.toRadians(heading),
  1285. pitch: Cesium.Math.toRadians(pitch),
  1286. range: range
  1287. },
  1288. });
  1289. },
  1290. /**
  1291. * @description: 飞行定位到一个矩形
  1292. * @param {Array.<Cartesian3>} cartesians 笛卡尔坐标数组 Array.<Cartesian3>
  1293. * @param {Number} heading =0.0 偏航角 正北,由正北向东偏向为正
  1294. * @param {*} pitch =-90 俯仰角 =-90 ENU局部坐标系,XY平面的旋转角度,平面下为负,上为正,
  1295. * @param {*} scale =1.0 范围缩放倍率
  1296. * @param {*} duration =3 持续时间
  1297. * @param {*} callBack =null 回调函数,定位完成后执行
  1298. * @return {*}
  1299. */
  1300. flyToRectangle: function(cartesians, heading = 0.0, pitch = -90, scale = 1.0, duration = 3, callBack = null) {
  1301. if (!maps.mapViewer) {
  1302. console.log('三维球未初始化!');
  1303. return;
  1304. }
  1305. if (!Array.isArray(cartesians)) {
  1306. console.log('定位范围不对!');
  1307. return;
  1308. }
  1309. if (scale < 0.1) {
  1310. scale = 1.0;
  1311. }
  1312. var rec = Cesium.Rectangle.fromCartesianArray(cartesians);
  1313. var boundingSphere = Cesium.BoundingSphere.fromRectangle3D(rec);
  1314. boundingSphere.radius = boundingSphere.radius * scale;
  1315. maps.mapViewer.camera.flyToBoundingSphere(boundingSphere, {
  1316. duration: duration,
  1317. maximumHeight: undefined,
  1318. complete: function() {
  1319. if (callBack) {
  1320. callBack();
  1321. } else {
  1322. console.log('定位失败!');
  1323. }
  1324. },
  1325. cancel: function() {
  1326. console.log('定位取消!');
  1327. },
  1328. offset: {
  1329. heading: Cesium.Math.toRadians(heading),
  1330. pitch: Cesium.Math.toRadians(pitch),
  1331. range: 0.0
  1332. }
  1333. });
  1334. },
  1335. flyToEntity(entity, ) {}
  1336. }
  1337. }