getCollect3DData.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561
  1. /**
  2. * [ONEMAP.M.projectController]
  3. * @return {[object]}
  4. */
  5. define(function (tplLayout) {
  6. /**
  7. * 初始化并订阅事件
  8. * @return {[type]} [description]
  9. */
  10. /**
  11. * 模块数据 用于数据存储和外部调用
  12. * @type {Object}
  13. * 数据存放
  14. */
  15. var modValue = {
  16. QXSY: {},
  17. model: {},
  18. seleted_guid: null,
  19. stereoscopic_handle: null,
  20. }
  21. /**
  22. * 状态值
  23. * @type {Boolean}
  24. * @default false
  25. * @private
  26. */
  27. var status = {
  28. initialized: false,
  29. isShowChild: false,
  30. connect: false,
  31. webSocketState: false
  32. };
  33. function init() {
  34. if (!status.initialized) {
  35. subscribe();
  36. bindEvent();
  37. prototypeBind();
  38. status.initialized = true;
  39. // $("#threeData").parent().find(".menu-content").show();
  40. }
  41. ONEMAP.C.publisher.publish({
  42. modName: 'threeData'
  43. }, 'menuListClick');
  44. }
  45. function prototypeBind() {
  46. //1.0GLTG插件
  47. var fixGltf = function (gltf) {
  48. if (!gltf.extensionsUsed) {
  49. return;
  50. }
  51. var v = gltf.extensionsUsed.indexOf('KHR_technique_webgl');
  52. var t = gltf.extensionsRequired.indexOf('KHR_technique_webgl');
  53. // 中招了。。
  54. if (v !== -1) {
  55. gltf.extensionsRequired.splice(t, 1, 'KHR_techniques_webgl');
  56. gltf.extensionsUsed.splice(v, 1, 'KHR_techniques_webgl');
  57. gltf.extensions = gltf.extensions || {};
  58. gltf.extensions['KHR_techniques_webgl'] = {};
  59. gltf.extensions['KHR_techniques_webgl'].programs = gltf.programs;
  60. gltf.extensions['KHR_techniques_webgl'].shaders = gltf.shaders;
  61. gltf.extensions['KHR_techniques_webgl'].techniques = gltf.techniques;
  62. var techniques = gltf.extensions['KHR_techniques_webgl'].techniques;
  63. gltf.materials.forEach(function (mat, index) {
  64. gltf.materials[index].extensions['KHR_technique_webgl'].values = gltf.materials[index].values;
  65. gltf.materials[index].extensions['KHR_techniques_webgl'] = gltf.materials[index].extensions['KHR_technique_webgl'];
  66. var vtxfMaterialExtension = gltf.materials[index].extensions['KHR_techniques_webgl'];
  67. for (var value in vtxfMaterialExtension.values) {
  68. var us = techniques[vtxfMaterialExtension.technique].uniforms;
  69. for (var key in us) {
  70. if (us[key] === value) {
  71. vtxfMaterialExtension.values[key] = vtxfMaterialExtension.values[value];
  72. delete vtxfMaterialExtension.values[value];
  73. break;
  74. }
  75. }
  76. };
  77. });
  78. techniques.forEach(function (t) {
  79. for (var attribute in t.attributes) {
  80. var name = t.attributes[attribute];
  81. t.attributes[attribute] = t.parameters[name];
  82. };
  83. for (var uniform in t.uniforms) {
  84. var name = t.uniforms[uniform];
  85. t.uniforms[uniform] = t.parameters[name];
  86. };
  87. });
  88. }
  89. }
  90. Object.defineProperties(Cesium.Model.prototype, {
  91. _cachedGltf: {
  92. set: function (value) {
  93. this._vtxf_cachedGltf = value;
  94. if (this._vtxf_cachedGltf && this._vtxf_cachedGltf._gltf) {
  95. fixGltf(this._vtxf_cachedGltf._gltf);
  96. }
  97. },
  98. get: function () {
  99. return this._vtxf_cachedGltf;
  100. }
  101. }
  102. });
  103. }
  104. function bindEvent() {
  105. var thrData = ONEMAP.D.globalSettingData.map3DModelSetting;
  106. var threeLength = ONEMAP.D.globalSettingData.map3DModelSetting.length;
  107. // alert(thrData);
  108. var ul = $('<ul class="menu-content"></ul>');
  109. for (var i = 0; i < threeLength; i++) {
  110. var threeDlist = $('<li class="item" cid="' + i + '"><input type="checkbox" class="zt-cbx" layer=""><span class="meun-checkBox menu-select-no"></span><span class="no-bg">' + thrData[i].name + '</span></li>');
  111. ul.append(threeDlist);
  112. }
  113. var data = ul.html();
  114. $(".sanWei .menu-content").html(data);
  115. $(".sanWei li").unbind('click').bind('click', function () {
  116. var menuCheckBox = $(this).find('.meun-checkBox');
  117. var ztCbx = $(this).find('.zt-cbx');
  118. if (menuCheckBox.hasClass("menu-select-no")) {
  119. menuCheckBox.removeClass('menu-select-no').addClass("menu-select");
  120. if (!map23DData.display.map3D) {
  121. $("#mapModelChange .bg")[0].click()
  122. }
  123. var idx = $(this).attr('cid');
  124. var modelData = ONEMAP.D.globalSettingData.map3DModelSetting[idx];
  125. var guid = null
  126. var options = {};
  127. if (modelData.type == "qxData") {
  128. guid = add3DQX(modelData);
  129. options = {
  130. action: "add",
  131. DOM: {
  132. guid: guid,
  133. type: "QXSY",
  134. name: $(this).find('.no-bg').text(),
  135. },
  136. mod: "QXSY"
  137. }
  138. } else {
  139. guid = add3DModel(modelData)
  140. options = {
  141. action: "add",
  142. DOM: {
  143. guid: guid,
  144. type: "MOXING",
  145. name: $(this).find('.no-bg').text(),
  146. },
  147. mod: "MOXING"
  148. }
  149. }
  150. if (!guid) {
  151. return
  152. }
  153. ztCbx.attr("layer", guid);
  154. ztCbx.attr("class", "zt-cbx " + guid);
  155. // // 添加到我的图层
  156. // var options = {
  157. // action: "add",
  158. // DOM: {
  159. // guid: guid,
  160. // type: "QXSY",
  161. // name: $(this).find('.no-bg').text(),
  162. // },
  163. // mod: "QXSY"
  164. // }
  165. ONEMAP.M.myLayers.myLayerControl(options); // 添加信息到“我的图层”
  166. ONEMAP.C.publisher.subscribe(layerAction, guid);
  167. } else {
  168. menuCheckBox.removeClass('menu-select').addClass("menu-select-no");
  169. var guid = ztCbx.attr("layer");
  170. var type = guid.split("-")[0]
  171. if (type == "QXSY") {
  172. removeQXSY(guid);
  173. } else {
  174. removeMX(guid)
  175. }
  176. ONEMAP.M.myLayers.myLayerControl({
  177. action: "remove",
  178. DOMid: guid
  179. }); // 移除数据层
  180. }
  181. })
  182. }
  183. function layerAction(options) {
  184. if (options.guid.split("-")[0] == "QXSY") {
  185. if (options.action == "remove") {
  186. removeQXSY(options.guid)
  187. } else if (options.action == "opacity") {
  188. opacityQXSY(options)
  189. }
  190. } else if (options.guid.split("-")[0] == "MOXING") {
  191. if (options.action == "remove") {
  192. removeMX(options.guid)
  193. } else if (options.action == "opacity") {
  194. opacityMX(options)
  195. } else if (options.action == "set") {
  196. // 高亮显示模型,选中后可拖动
  197. removeModelHighlight();
  198. if (modValue.seleted_guid != null && options.guid == modValue.seleted_guid) {
  199. removeControlStereoscopic();
  200. modValue.seleted_guid = null;
  201. return;
  202. }
  203. modValue.seleted_guid = options.guid;
  204. addControlStereoscopic();
  205. }
  206. }
  207. }
  208. function removeQXSY(guid) {
  209. map3DViewer.map.scene.primitives.remove(modValue.QXSY[guid]);
  210. delete modValue.QXSY[guid];
  211. }
  212. function opacityQXSY(options) {
  213. if (options.options.opacity)
  214. modValue.QXSY[options.guid].show = true
  215. if (!options.options.opacity)
  216. modValue.QXSY[options.guid].show = false
  217. }
  218. function removeMX(guid) {
  219. map3DViewer.map.entities.remove(modValue.model[guid]);
  220. delete modValue.model[guid];
  221. if (modValue.seleted_guid == guid) {
  222. removeControlStereoscopic()
  223. modValue.seleted_guid = null
  224. }
  225. }
  226. function opacityMX(options) {
  227. if (options.options.opacity) {
  228. modValue.model[options.guid].show = true
  229. } else {
  230. modValue.model[options.guid].show = false
  231. }
  232. }
  233. // 添加控制 模型 事件
  234. function addControlStereoscopic() {
  235. removeControlStereoscopic()
  236. addModelHighlight();
  237. modValue.stereoscopic_handle = new Cesium.ScreenSpaceEventHandler(map3DViewer.map.scene.canvas);
  238. // console.log(viewer.scene.canvas);
  239. modValue.stereoscopic_handle.setInputAction(mouseLeftDown, Cesium.ScreenSpaceEventType.LEFT_DOWN);
  240. }
  241. function mouseLeftDown(e) {
  242. //当鼠标点击时获取移动的位置
  243. var pick = map3DViewer.map.scene.pick(e.position);
  244. // console.log(pick);
  245. if (pick != undefined) {
  246. var id = pick.id._id;
  247. if (modValue.seleted_guid != id) {
  248. return;
  249. } else {
  250. //禁止地图移动,绑定鼠标移动时间,移动时模型随之移动
  251. setMapControl(false)
  252. modValue.stereoscopic_handle.setInputAction(mouseLeftUp, Cesium.ScreenSpaceEventType.LEFT_UP);
  253. modValue.stereoscopic_handle.setInputAction(mouseMove, Cesium.ScreenSpaceEventType.MOUSE_MOVE)
  254. }
  255. }
  256. }
  257. function mouseLeftUp(e) {
  258. // //当鼠标点击时获取移动的位置
  259. // var pick = map3DViewer.map.scene.pick(e.position);
  260. // if (pick != undefined) {
  261. // var id = pick.id._id;
  262. // if (modValue.seleted_guid != id) {
  263. // return;
  264. // } else {
  265. // //恢复地图移动 取消鼠标移动事件
  266. // setMapControl(true)
  267. // modValue.stereoscopic_handle.removeInputAction(mouseMove, Cesium.ScreenSpaceEventType.MOUSE_MOVE)
  268. // }
  269. // }
  270. //恢复地图移动 取消鼠标移动事件
  271. setMapControl(true)
  272. modValue.stereoscopic_handle.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_UP)
  273. modValue.stereoscopic_handle.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE)
  274. }
  275. function mouseMove(e) {
  276. var ray = map3DViewer.map.camera.getPickRay(e.endPosition);
  277. var cartesian = map3DViewer.map.scene.globe.pick(ray, map3DViewer.map.scene);
  278. // console.log(cartesian);
  279. modValue.model[modValue.seleted_guid].position.setValue(cartesian);
  280. }
  281. // 移除控制 模型 事件
  282. function removeControlStereoscopic() {
  283. if (modValue.stereoscopic_handle != null) {
  284. modValue.stereoscopic_handle.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOWN);
  285. modValue.stereoscopic_handle.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_UP);
  286. modValue.stereoscopic_handle.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
  287. modValue.stereoscopic_handle = null;
  288. }
  289. }
  290. // 添加 模型 高亮
  291. function addModelHighlight() {
  292. modValue.model[modValue.seleted_guid].model.silhouetteColor = Cesium.Color.BLUE;
  293. modValue.model[modValue.seleted_guid].model.silhouetteSize = 3.0;
  294. }
  295. // 移除 模型 高亮
  296. function removeModelHighlight() {
  297. if (modValue.seleted_guid != null) {
  298. modValue.model[modValue.seleted_guid].model.silhouetteSize = 0.0;
  299. }
  300. }
  301. function setMapControl(judge) {
  302. var obj = {};
  303. if (!judge) {
  304. modValue.screenSpaceCameraController = {
  305. rotateEventTypes: map3DViewer.map.scene.screenSpaceCameraController.rotateEventTypes,
  306. tiltEventTypes: map3DViewer.map.scene.screenSpaceCameraController.tiltEventTypes,
  307. translateEventTypes: map3DViewer.map.scene.screenSpaceCameraController.translateEventTypes,
  308. zoomEventTypes: map3DViewer.map.scene.screenSpaceCameraController.zoomEventTypes
  309. // enableRotate: map3DViewer.map.scene.screenSpaceCameraController.enableRotate,
  310. // enableTranslate: map3DViewer.map.scene.screenSpaceCameraController.enableTranslate,
  311. // enableZoom: map3DViewer.map.scene.screenSpaceCameraController.enableZoom,
  312. // enableTilt: map3DViewer.map.scene.screenSpaceCameraController.enableTilt,
  313. }
  314. obj = {
  315. rotateEventTypes: undefined,
  316. tiltEventTypes: undefined,
  317. translateEventTypes: undefined,
  318. zoomEventTypes: undefined
  319. }
  320. } else {
  321. if (!modValue.screenSpaceCameraController) {
  322. return
  323. }
  324. obj = {
  325. rotateEventTypes: modValue.screenSpaceCameraController.rotateEventTypes,
  326. tiltEventTypes: modValue.screenSpaceCameraController.tiltEventTypes,
  327. translateEventTypes: modValue.screenSpaceCameraController.translateEventTypes,
  328. zoomEventTypes: modValue.screenSpaceCameraController.zoomEventTypes,
  329. }
  330. modValue.screenSpaceCameraController = null;
  331. }
  332. // 如果为真,则允许用户旋转相机。如果为假,相机将锁定到当前标题。此标志仅适用于2D和3D。
  333. // map3DViewer.map.scene.screenSpaceCameraController.enableRotate = obj.enableRotate;
  334. // // 如果为true,则允许用户平移地图。如果为假,相机将保持锁定在当前位置。此标志仅适用于2D和Columbus视图模式。
  335. // map3DViewer.map.scene.screenSpaceCameraController.enableTranslate = obj.enableTranslate;
  336. // // 如果为真,允许用户放大和缩小。如果为假,相机将锁定到距离椭圆体的当前距离
  337. // map3DViewer.map.scene.screenSpaceCameraController.enableZoom = obj.enableZoom;
  338. // // 如果为真,则允许用户倾斜相机。如果为假,相机将锁定到当前标题。这个标志只适用于3D和哥伦布视图。
  339. // map3DViewer.map.scene.screenSpaceCameraController.enableTilt = obj.enableTilt;
  340. map3DViewer.map.scene.screenSpaceCameraController.rotateEventTypes = obj.rotateEventTypes;
  341. map3DViewer.map.scene.screenSpaceCameraController.tiltEventTypes = obj.tiltEventTypes;
  342. map3DViewer.map.scene.screenSpaceCameraController.translateEventTypes = obj.translateEventTypes;
  343. map3DViewer.map.scene.screenSpaceCameraController.zoomEventTypes = obj.zoomEventTypes;
  344. }
  345. /**
  346. * 设置界面
  347. */
  348. function setLayout() {
  349. }
  350. /**
  351. * 界面重置
  352. * @return {[type]} [description]
  353. */
  354. function layoutResize(options) {
  355. if (options.modName != "threeData") {
  356. remove();
  357. } else {
  358. if (status.isShowChild) {
  359. remove();
  360. } else {
  361. $("#menu .sanWei").addClass('active');
  362. status.isShowChild = true;
  363. if (map23DData.show3DAlert) {
  364. ONEMAP.C.publisher.publish('3D', 'layout::mapStyle');
  365. }
  366. }
  367. }
  368. }
  369. /**
  370. * 模块移除
  371. * @return {[type]} [description]
  372. */
  373. function remove() {
  374. //取消订阅
  375. unSubscribe();
  376. $("#menu .sanWei").removeClass('active');
  377. status.isShowChild = false;
  378. }
  379. /**
  380. * 加载/移除倾斜摄影
  381. * @return {[type]} [description]
  382. */
  383. function add3DQX(options) {
  384. var guid = map23DControl.buildGuid('QXSY-3DData');
  385. var tilesetUrl = options.url
  386. var tileset = new Cesium.Cesium3DTileset({
  387. url: tilesetUrl,
  388. show: true,
  389. });
  390. modValue.tileset = tileset
  391. map3DViewer.map.scene.primitives.add(tileset, 1);
  392. tileset.readyPromise.then(function (tileset) {
  393. // mapControl.viewer.camera.viewBoundingSphere(tileset.boundingSphere, new Cesium.HeadingPitchRange(0, -0.5, 0));
  394. // changeHeight(0)
  395. });
  396. map3DViewer.map.zoomTo(tileset);
  397. modValue.QXSY[guid] = tileset
  398. return guid;
  399. };
  400. /**
  401. * [add3DModel description]
  402. * 加载/移除三维模型
  403. * @param {[type]} options [description]
  404. * @return {[type]} [description]
  405. */
  406. function add3DModel(options) {
  407. var guid = map23DControl.buildGuid('MOXING-3DData');
  408. options.m_height = JSON.parse(options.m_height);
  409. options.m_hdeading = JSON.parse(options.m_hdeading);
  410. options.m_pitch = JSON.parse(options.m_pitch);
  411. options.m_roll = JSON.parse(options.m_roll);
  412. options.m_scale = JSON.parse(options.m_scale);
  413. var position = Cesium.Cartesian3.fromDegrees(options.center.lng, options.center.lat, options.m_height);
  414. var tileset = map3DViewer.map.entities.add({
  415. id: guid,
  416. position: position,
  417. orientation: Cesium.Transforms.headingPitchRollQuaternion(
  418. position,
  419. new Cesium.HeadingPitchRoll(
  420. Cesium.Math.toRadians(options.m_hdeading),
  421. Cesium.Math.toRadians(options.m_pitch),
  422. Cesium.Math.toRadians(options.m_roll)
  423. )
  424. ),
  425. model: {
  426. uri: onemapUrlConfig.qxsy + options.url,
  427. // uri: options.url,
  428. minimumPixelSize: 128,
  429. scale: options.m_scale,
  430. heightReference: Cesium.HeightReference.RELATIVE_TO_GROUND
  431. }
  432. });
  433. map3DViewer.map.zoomTo(tileset);
  434. modValue.model[guid] = tileset;
  435. return guid;
  436. }
  437. function add3DModelNoFly(options) {
  438. if (options.name) {
  439. modValue['model' + options.indexNum] = locaSpaceMap.Globe.Layers.Add1(options.url);
  440. } else {
  441. locaSpaceMap.Globe.Layers.RemoveLayerByID(modValue['model' + options.indexNum]['ID']);
  442. }
  443. locaSpaceMap.Refresh();
  444. };
  445. function qxAction(options) {
  446. var thrData = ONEMAP.D.globalSettingData.map3DModelSetting;
  447. var opData = {
  448. lng: "",
  449. lat: "",
  450. zoom: ""
  451. };
  452. for (var i = 0; i < thrData.length; i++) {
  453. var threeDlist = thrData[i].type;
  454. if (threeDlist == "qxData") {
  455. // alert("qx");
  456. // alert(opData.lng);
  457. // alert(thrData[i].center.lat)
  458. if (options == "add") {
  459. // alert(thrData[i].name);
  460. add3DModelNoFly(thrData[i]);
  461. thrData[i].indexNum = i;
  462. if (opData.lng == "") {
  463. opData.lng = thrData[i].center.lng;
  464. opData.lat = thrData[i].center.lat;
  465. opData.zoom = thrData[i].zoom;
  466. // if(options == "add"){
  467. point3D = locaSpaceMap.CreateGeoPoint3D();
  468. point3D.X = opData.lng;
  469. point3D.Y = opData.lat;
  470. point3D.Z = opData.zoom;
  471. feature = locaSpaceMap.CreateFeature();
  472. feature.Geometry = point3D;
  473. locaSpaceMap.Globe.FlyToFeature1(feature, 0, 45, 1); //飞行定位到目标点
  474. //locaSpace.FlyToPlace(opData.lng,opData.lat,opData.zoom,0,45);
  475. // }
  476. }
  477. } else if (options == "remove") {
  478. var modelData = {
  479. indexNum: i
  480. }
  481. add3DModelNoFly(modelData);
  482. }
  483. } else {
  484. // alert(threeDlist);
  485. }
  486. }
  487. // if(options == "add"){
  488. // locaSpace.FlyToPlace(opData.lng,opData.lat,opData.zoom,0,45);
  489. // }
  490. }
  491. /**
  492. * 注册订阅
  493. * @type {Function}
  494. * 推送:ONEMAP.C.publisher.publish(options,'moduleName::type');
  495. * 订阅:ONEMAP.C.publisher.subscribe(layoutResize,'sideBarLayoutChange');
  496. */
  497. function subscribe() {
  498. ONEMAP.C.publisher.subscribe(layoutResize, 'menuListClick');
  499. ONEMAP.C.publisher.subscribe(qxAction, '3DModelControl');
  500. // ONEMAP.C.publisher.subscribe(remove, 'cleanMap');
  501. }
  502. /**
  503. * 取消订阅
  504. * @type {Function}
  505. * 取消订阅:ONEMAP.C.publisher.unSubscribe(layoutResize,'sideBarLayoutChange');
  506. */
  507. function unSubscribe() {
  508. }
  509. return ONEMAP.M.threeData = {
  510. init: init
  511. }
  512. });