getCollect2DData.js 46 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023
  1. /**
  2. * [ONEMAP.M.projectController]
  3. * @return {[object]}
  4. */
  5. define(['modDir/service/cartodbParse'], function (cartodbParseF) {
  6. /**
  7. * 初始化并订阅事件
  8. * @return {[type]} [description]
  9. */
  10. /**
  11. * 模块数据 用于数据存储和外部调用
  12. * @type {Object}
  13. * 数据存放
  14. */
  15. var modValue = {
  16. }
  17. /**
  18. * 状态值
  19. * @type {Boolean}
  20. * @default false
  21. * @private
  22. */
  23. var status = {
  24. initialized: false,
  25. isShowChild: false,
  26. connect: false,
  27. webSocketState: false,
  28. ztContent: false
  29. };
  30. var video_stus = {
  31. //渲染div的id
  32. id: "",
  33. //时间轴移动的位置
  34. x: 0,
  35. //播放的当前页数
  36. nowPage: 0,
  37. //播放总页数
  38. dataCount: 0,
  39. //每秒移动的像素
  40. perTime: "",
  41. //播放间隔
  42. intervalTime: 5200,
  43. //定时事件ID
  44. intervalId: null,
  45. //启报时间组
  46. qbTime: [],
  47. //vti
  48. vti: [],
  49. //urls
  50. urls: [],
  51. zixiang: [],
  52. guids: []
  53. }
  54. function init() {
  55. if (!status.initialized) {
  56. subscribe();
  57. bindEvent();
  58. status.initialized = true;
  59. status.ztContent = true;
  60. // $("#heaven").parent().find(".menu-content").show();
  61. }
  62. setDixingList();
  63. if (status.ztContent) {
  64. $("#menu .ztContent").addClass("active");
  65. $(this).addClass("active");
  66. status.ztContent = false;
  67. } else {
  68. $("#menu .ztContent").removeClass("active");
  69. $(this).removeClass("active");
  70. status.ztContent = true;
  71. }
  72. ONEMAP.C.publisher.publish({
  73. modName: 'heaven'
  74. }, 'menuListClick');
  75. }
  76. function bindEvent() {
  77. $("#layerControlMenu .sxlayer .close").on("click", function () {
  78. removeSxLayer()
  79. })
  80. var myFunc = function () {
  81. removeSxLayer()
  82. $("#layerControlMenu .clearLayer").unbind("click", myFunc)
  83. };
  84. $("#layerControlMenu .clearLayer").bind("click", myFunc)
  85. $("#layerControlMenu .sxlayer input[type='checkbox']").on("click", function () {
  86. if ($("#layerControlMenu .sxlayer .eye").hasClass('checkTrue')) {
  87. $(".shixu-time-box").hide();
  88. } else {
  89. $(".shixu-time-box").show();
  90. }
  91. })
  92. }
  93. function removeSxLayer() {
  94. for (var i = 0; i < video_stus.guids.length; i++) {
  95. map23DControl.tileLayer({
  96. action: 'remove',
  97. guid: video_stus.guids[i]
  98. })
  99. }
  100. if ($("#menu .dzzy section .sectionbg .translate").text().indexOf("时序图层") > -1) {
  101. $("#menu .dzzy section .meun-checkBox").removeClass("menu-select").addClass("menu-select-no")
  102. }
  103. // $("#layerControlMenu .sxlayer").remove();
  104. // map2DViewer.map.remove('BJDXAP2016')
  105. map2DViewer.map.setZoomScope(1, 19);
  106. $(".shixu-time-box").hide();
  107. }
  108. //添加地形图组
  109. function setDixingList() {
  110. $(".ztContent").html("");
  111. var zt = $(".ztContent");
  112. var category = ONEMAP.D.globalSettingData.map2DThematicCategory;
  113. for (var i = 0; i < category.length; i++) {
  114. var liHtml = $('<section class="item"><div class="sectionbg"><span class="translate">' + category[i] + '</span></div></section>')
  115. // 可对category[i]进行识别
  116. if (category[i] == "城市地质") {
  117. liHtml = $('<section class="item"><div class="sectionbg" id="cityGeology"><span class="translate">' + category[i] + '</span></div></section>')
  118. }
  119. var linkcontent = $('<ul class="linkContent" style="display:none"></ul>');
  120. $(ONEMAP.D.globalSettingData.map2DThematicSetting).each(function (index, el) {
  121. if (el.category === category[i]) {
  122. var thematicLink = $('<li class="item thematic-layer-link"><div class="linkLibg"></div><input type="checkbox" class="zt-cbx"/><span class="meun-checkBox menu-select-no"></span><span class="translate" title="' + el.name + '">' + el.name + '</span></li>');
  123. thematicLink.bind('click', el, function (e) {
  124. var mc = thematicLink.find(".meun-checkBox");
  125. // console.log(el);
  126. if (!mc.hasClass("menu-select-no")) {
  127. mc.removeClass('menu-select').addClass("menu-select-no");
  128. if (ONEMAP.M.toolWeatherMap) {
  129. ONEMAP.M.toolWeatherMap.remove();
  130. }
  131. // 从我的图层中移除
  132. var guid = mc.prev().attr("layer");
  133. // console.log(guid);
  134. var options = {
  135. action: "remove",
  136. DOMid: guid
  137. }
  138. ONEMAP.C.publisher.publish({
  139. type: el.legend
  140. }, 'legend:remove');
  141. ONEMAP.M.myLayers.myLayerControl(options); // 移除数据层
  142. removeCurrentOverLayerGai(guid);
  143. if (typeof (e.data['max_zoom']) != "undefined") {
  144. ONEMAP.M.myLayers.zoomActions("remove", e.data['min_zoom'], e.data['max_zoom']);
  145. } else {
  146. ONEMAP.M.myLayers.zoomActions("remove", 1, 19);
  147. }
  148. //时序
  149. if (thematicLink.parents().filter("section").find(".sectionbg .translate").text().indexOf("时序图层") > -1) {
  150. $("#layerControlMenu .sxlayer .close").click();
  151. // setTimeout(function(){
  152. // mc.removeClass('menu-select').addClass("menu-select-no");
  153. // },800)
  154. // removeSxLayer();
  155. }
  156. } else {
  157. // console.log(el);
  158. // console.log(el.type);
  159. // console.log(e.data.type);
  160. mc.removeClass('menu-select-no').addClass("menu-select");
  161. // 专题一张图自动跳转二维
  162. ONEMAP.C.publisher.publish('2D', 'layout::mapStyle');
  163. if (el.type == "otherOrigin") {
  164. el.guid = map23DControl.buildGuid("zhuanTi");
  165. }
  166. if (ONEMAP.M.toolWeatherMap) {
  167. ONEMAP.M.toolWeatherMap.remove();
  168. }
  169. // removeCurrentOverLayer();
  170. if (e.data.type === "weatherMap") {
  171. //获取云图图集列表数据
  172. var weatherData;
  173. $.ajax({
  174. type: 'get',
  175. dataType: 'jsonp',
  176. url: el.productUrl + '/production/product_category?production_id=' + el.guid,
  177. beforeSend: ONEMAP.V.loading.load(),
  178. success: function (data) {
  179. weatherData = data;
  180. //添加云图控件
  181. addWeatherControl(weatherData, e.data);
  182. },
  183. error: function (data) {
  184. //console.log("有点小失败");
  185. },
  186. completer: ONEMAP.V.loading.loaded()
  187. })
  188. // $('#userThematicList .selected').removeClass('selected');
  189. // mc.addClass('selected');
  190. } else if (e.data.type === "thematicOrigin") {
  191. // console.log("thema");
  192. // console.log(e.data);
  193. // 专题一张图(中国地图、海图等)
  194. var layerLength = ONEMAP.M.myLayers.checkLength();
  195. if (layerLength < map23DConfig.layerMaxLength) {
  196. url2D = e.data.url + '/' + e.data.guid + '?l={z}&x={x}&y={y}';
  197. url3D = e.data.url + '/' + e.data.guid + '?z={z}&x={x}&y={y}';
  198. //url3D = e.data.url + '/' + e.data.guid + '?z=%d&x=%d&y=%d';
  199. modValue.currentOverLayerGuid = map23DControl.tileLayer({
  200. action: 'add',
  201. layer: {
  202. url2D: url2D,
  203. url3D: url3D,
  204. imageType: 'png',
  205. name: e.data.name,
  206. minZoom: e.data.min_zoom || 1,
  207. maxZoom: e.data.max_zoom || 19,
  208. guid: e.data.guid
  209. }
  210. })
  211. // 添加到我的图层
  212. if (el.legend) {
  213. var options = {
  214. action: "add",
  215. DOM: {
  216. guid: modValue.currentOverLayerGuid,
  217. type: el.type,
  218. name: el.name,
  219. legend: el.legend
  220. },
  221. mod: el.type
  222. }
  223. } else {
  224. var options = {
  225. action: "add",
  226. DOM: {
  227. guid: modValue.currentOverLayerGuid,
  228. type: el.type,
  229. name: el.name
  230. },
  231. mod: el.type
  232. }
  233. }
  234. mc.prev().attr("layer", options.DOM.guid);
  235. mc.prev().attr("class", "zt-cbx " + options.DOM.guid);
  236. modValue.DOMid = ONEMAP.M.myLayers.myLayerControl(options); // 添加信息到“我的图层”
  237. ONEMAP.C.publisher.subscribe(layerAction, options.DOM.guid);
  238. thematicControl(
  239. map2DViewer.layers[modValue.currentOverLayerGuid], {
  240. data: e.data,
  241. showFavBtn: false,
  242. closeCallback: function () {
  243. removeCurrentOverLayer();
  244. $('#userThematicList .selected').removeClass('selected');
  245. }
  246. })
  247. ONEMAP.D.overLayerCount++;
  248. map2DViewer.map.setZoomScope(e.data['min_zoom'], e.data['max_zoom']);
  249. // console.log(e.data);
  250. // console.log(e.data['max_zoom']);
  251. if (typeof (e.data['max_zoom']) != "undefined") {
  252. ONEMAP.M.myLayers.zoomActions("add", e.data['min_zoom'], e.data['max_zoom'], map23DData.view.center['lat'], map23DData.view.center['lng'], e.data['zoom'], e.data.name);
  253. } else {
  254. ONEMAP.M.myLayers.zoomActions("add", 1, 19, map23DData.view.center['lat'], map23DData.view.center['lng'], e.data['zoom'], e.data.name);
  255. }
  256. // ONEMAP.M.myLayers.zoomActions("add",e.data['min_zoom'], e.data['max_zoom']);
  257. map23DControl.setView({
  258. center: {
  259. lat: e.data['center'].lat,
  260. lng: e.data['center'].lng
  261. },
  262. zoom: e.data['zoom'],
  263. tilt: 0
  264. });
  265. // 针对磁场分布图的透明度预设置
  266. if (e.data.guid == "CCFBT") {
  267. ONEMAP.C.publisher.publish({
  268. action: 'opacity',
  269. options: {
  270. opacity: 0.5
  271. },
  272. guid: options.DOM.guid
  273. }, options.DOM.guid);
  274. $("#layerControlMenu .myLayers .op .yuan").css("left", "35px");
  275. $("#layerControlMenu .myLayers .op .chang").css("width", "35px");
  276. }
  277. } else {
  278. $(this).find(".meun-checkBox").removeClass("menu-select").addClass("menu-select-no");
  279. ONEMAP.C.publisher.publish({
  280. type: 'warning',
  281. message: '图层数量已达上限'
  282. }, 'noteBar::add');
  283. return false;
  284. }
  285. // $('#userThematicList .selected').removeClass('selected');
  286. // mc.addClass('selected');
  287. //E 优化
  288. } else if (e.data.type === "vectorOrigin") {
  289. var cartodbF = new cartodbParseF();
  290. cartodbF.getVizInfo({
  291. vizUrl: e.data['url']
  292. }, function (tileData) {
  293. var tdTileLayerUrl = tileData['templateUrl'].replace('{z}/{x}/{y}', '%d/%d/%d');
  294. modValue.currentOverLayerGuid = map23DControl.tileLayer({
  295. action: 'add',
  296. layer: {
  297. url2D: tileData['templateUrl'],
  298. url3D: tdTileLayerUrl,
  299. imageType: 'png',
  300. name: e.data.name,
  301. minZoom: e.data.min_zoom || 1,
  302. maxZoom: e.data.max_zoom || 19
  303. }
  304. })
  305. map2DViewer.layers[modValue.currentOverLayerGuid]['utfgrids'] = [];
  306. //添加utfgrid
  307. _.each(tileData.utfgridUrl, function (el, index) {
  308. var aGridLayer = new L.UtfGrid(el + '?callback={cb}');
  309. map2DViewer.layers[modValue.currentOverLayerGuid]['utfgrids'].push(aGridLayer);
  310. aGridLayer.layerNum = index;
  311. aGridLayer.on('click', function (e) {
  312. L.DomEvent.stopPropagation(e);
  313. if (e.data) {
  314. var layerNum = e.target._map._layers[e.target._leaflet_id].layerNum;
  315. $.ajax({
  316. url: tileData.serverApiUrl + '/v1/map/' + tileData.layergroupid + '/' + layerNum + '/attributes/' + e.data.cartodb_id,
  317. type: 'GET',
  318. dataType: 'jsonp'
  319. })
  320. .done(function (data) {
  321. if (data) {
  322. var popupContent = $('<div></div>');
  323. _.each(data, function (pel, pindex) {
  324. popupContent.append('<div><strong>' + pindex + '</strong>:' + pel + '</div>')
  325. });
  326. var popup = L.popup()
  327. .setLatLng(e.latlng)
  328. .setContent(popupContent.get(0))
  329. .openOn(map2DViewer.map);
  330. }
  331. });
  332. }
  333. });
  334. aGridLayer.addTo(map2DViewer.map);
  335. });
  336. // 添加到我的图层
  337. var options = {
  338. action: "add",
  339. DOM: {
  340. guid: modValue.currentOverLayerGuid,
  341. type: el.type,
  342. name: el.name,
  343. legend: el.legend
  344. },
  345. mod: el.type
  346. }
  347. mc.prev().attr("layer", options.DOM.guid);
  348. mc.prev().attr("class", "zt-cbx " + options.DOM.guid);
  349. modValue.DOMid = ONEMAP.M.myLayers.myLayerControl(options); // 添加信息到“我的图层”
  350. ONEMAP.C.publisher.subscribe(layerAction, options.DOM.guid);
  351. thematicControl(
  352. map2DViewer.layers[modValue.currentOverLayerGuid], {
  353. data: e.data,
  354. showFavBtn: false,
  355. closeCallback: function () {
  356. removeCurrentOverLayer();
  357. $('#userThematicList .selected').removeClass('selected');
  358. }
  359. })
  360. ONEMAP.D.overLayerCount++;
  361. map2DViewer.map.setZoomScope(e.data['min_zoom'], e.data['max_zoom']);
  362. map23DControl.setView({
  363. center: {
  364. lat: e.data['center'].lat,
  365. lng: e.data['center'].lng
  366. },
  367. zoom: e.data['zoom'],
  368. tilt: 0
  369. })
  370. // $('#userThematicList .selected').removeClass('selected');
  371. // mc.addClass('selected');
  372. //E 优化
  373. });
  374. } else if (e.data.type === "shixuOrigin") { //时序图层
  375. // console.log(e.data);
  376. var zixiangobj = e.data.zixiang;
  377. zixiangobj.sort(function (a, b) {
  378. return a.sxTime - b.sxTime;
  379. })
  380. $("#layerControlMenu .sxlayer .close").click();
  381. mc.removeClass('menu-select-no').addClass("menu-select");
  382. var lasttime = zixiangobj.length;
  383. video_stus.data = e.data;
  384. video_stus.intervalTime = e.data.intervalTime;
  385. video_stus.qbTime = [];
  386. video_stus.vti = [];
  387. video_stus.urls = [];
  388. if ($(".shixu-time-box").length < 2) {
  389. $("#wrapper").append($(".shixu-time-box"));
  390. }
  391. $(".shixu-time-box").show();
  392. $(".shixu-time-box .sx-title-left-c .title").text(e.data.name);
  393. $(".shixu-time-box .sx-title-left-c .time").text(zixiangobj[0].sxTime);
  394. $(".shixu-time-box .sx-video-progress-nowtime").text(1);
  395. $(".shixu-time-box .sx-video-progress-lasttime").text(lasttime);
  396. for (var i = 0; i < lasttime; i++) {
  397. video_stus.qbTime.push(zixiangobj[i].sxTime);
  398. video_stus.urls.push(zixiangobj[i].sxUrl);
  399. }
  400. bindSxPlayEvents();
  401. } else { // 天地图
  402. // console.log("other 天地图");
  403. var layerLength = ONEMAP.M.myLayers.checkLength();
  404. if (layerLength < map23DConfig.layerMaxLength) {
  405. var tdTileLayerUrl = e.data['url'].replace('?x={x}&y={y}&z={z}', '?z=%d&x=%d&y=%d');
  406. tdTileLayerUrl = tdTileLayerUrl.replace('?z={z}&x={x}&y={y}', '?z=%d&x=%d&y=%d');
  407. tdTileLayerUrl = tdTileLayerUrl.replace('{z}/{y}/{x}', '%d/%d/%d');
  408. modValue.currentOverLayerGuid = map23DControl.tileLayer({
  409. action: 'add',
  410. layer: {
  411. url2D: e.data['url'],
  412. url3D: tdTileLayerUrl,
  413. imageType: 'png',
  414. name: e.data.name,
  415. minZoom: e.data.min_zoom || 1,
  416. maxZoom: e.data.max_zoom || 19
  417. }
  418. })
  419. // 添加到我的图层
  420. if (el.legend) {
  421. var options = {
  422. action: "add",
  423. DOM: {
  424. guid: modValue.currentOverLayerGuid,
  425. type: el.type,
  426. name: el.name,
  427. legend: el.legend
  428. },
  429. mod: el.type
  430. }
  431. } else {
  432. var options = {
  433. action: "add",
  434. DOM: {
  435. guid: modValue.currentOverLayerGuid,
  436. type: el.type,
  437. name: el.name
  438. },
  439. mod: el.type
  440. }
  441. }
  442. mc.prev().attr("layer", options.DOM.guid);
  443. mc.prev().attr("class", "zt-cbx " + options.DOM.guid);
  444. modValue.DOMid = ONEMAP.M.myLayers.myLayerControl(options); // 添加信息到“我的图层”
  445. ONEMAP.C.publisher.subscribe(layerAction, options.DOM.guid);
  446. //S 优化
  447. //添加图层透明度控件
  448. // overLayerOpacityControl = new L.Control.LayerOpacity(
  449. // map2DViewer.layers[modValue.currentOverLayerGuid], {
  450. // showFavBtn: false,
  451. // closeCallback: function() {
  452. // removeCurrentOverLayer();
  453. // $('#userThematicList .selected').removeClass('selected');
  454. // }
  455. // }
  456. // ).addTo(map2DViewer.map);
  457. thematicControl(
  458. map2DViewer.layers[modValue.currentOverLayerGuid], {
  459. data: e.data,
  460. showFavBtn: false,
  461. closeCallback: function () {
  462. removeCurrentOverLayer();
  463. $('#userThematicList .selected').removeClass('selected');
  464. }
  465. })
  466. ONEMAP.D.overLayerCount++;
  467. map2DViewer.map.setZoomScope(e.data['min_zoom'], e.data['max_zoom']);
  468. if (typeof (e.data['max_zoom']) != "undefined") {
  469. ONEMAP.M.myLayers.zoomActions("add", e.data['min_zoom'], e.data['max_zoom'], map23DData.view.center['lat'], map23DData.view.center['lng'], e.data['zoom'], e.data.name);
  470. } else {
  471. ONEMAP.M.myLayers.zoomActions("add", 1, 19, map23DData.view.center['lat'], map23DData.view.center['lng'], e.data['zoom'], e.data.name);
  472. }
  473. map23DControl.setView({
  474. center: {
  475. lat: e.data['center'].lat,
  476. lng: e.data['center'].lng
  477. },
  478. zoom: e.data['zoom'],
  479. tilt: 0
  480. })
  481. } else {
  482. $(this).find(".meun-checkBox").removeClass("menu-select").addClass("menu-select-no");
  483. ONEMAP.C.publisher.publish({
  484. type: 'warning',
  485. message: '图层数量已达上限'
  486. }, 'noteBar::add');
  487. return false;
  488. }
  489. // $('#userThematicList .selected').removeClass('selected');
  490. // mc.addClass('selected');
  491. //E 优化
  492. }
  493. }
  494. });
  495. thematicLink.appendTo(linkcontent);
  496. }
  497. });
  498. liHtml.find('.sectionbg').bind('click', function () {
  499. $(this).parent().find('.linkContent').toggle();
  500. if ($(this).hasClass('open')) {
  501. $(this).removeClass('open');
  502. if ($(this).attr("id") == "cityGeology") {
  503. require(['modDir/menu/cityGeology'], function (cityGeology) {
  504. cityGeology.removeAll();
  505. });
  506. var layer = $("#cityGeology").attr("layer");
  507. $("#layerControlMenu li." + layer).find(".close").click();
  508. }
  509. } else {
  510. if ($(this).attr("id") == "cityGeology") {
  511. require(['modDir/menu/cityGeology'], function (cityGeology) {
  512. cityGeology.init();
  513. });
  514. }
  515. $(this).addClass('open');
  516. $(this).parent().siblings().find('.linkContent').hide();
  517. $(this).parent().siblings().find('.sectionbg').removeClass('open');
  518. }
  519. })
  520. linkcontent.appendTo(liHtml);
  521. // 可对category[i]进行识别
  522. if (category[i] == "电磁" || category[i] == "磁力" || category[i] == "重力") {
  523. liHtml.appendTo($(".dqwlContent"));
  524. } else if (category[i] == "基础地质" || category[i] == "城市地质" || category[i] == "军事地质") {
  525. liHtml.appendTo($(".dzContent"));
  526. } else {
  527. liHtml.appendTo(zt);
  528. }
  529. // liHtml.appendTo($("#userThematicList"));
  530. }
  531. // zt.html($("#userThematicList").html());
  532. // $("#userThematicList section").eq(0).find('.linkContent').show();
  533. // $("#userThematicList section").eq(0).find('.sectionbg').addClass('open');
  534. //更新滚动条
  535. // $('#userThematic .ii-body').mCustomScrollbar('update');
  536. }
  537. //添加三维专题图控制条
  538. function thematicControl(layer, options) {
  539. modValue.thematicControlHtml = $("<div class='thematicControl'>" +
  540. "<iframe frameborder='0' class='cover-iframe'></iframe>" +
  541. "</div>");
  542. var cover_content = $("<div class='cover-content'></div>");
  543. cover_content.appendTo(modValue.thematicControlHtml);
  544. if (options.showFavBtn || !options.onlyShow) {
  545. var optionsWrap = $("<div class='options-wrap'></div>");
  546. optionsWrap.appendTo(cover_content);
  547. }
  548. $("<div class='thematicName'>名称:" + options.data.name + "</div>").appendTo(cover_content);
  549. if (options.atlas) {
  550. var atlasHtml = $("<a class='info_Btntd'>详情</a>");
  551. atlasHtml.appendTo(optionsWrap);
  552. atlasHtml.bind('click', function () {});
  553. }
  554. if (options.showFavBtn) {
  555. var favBtnHtml = $("<a class='fav_abtntd'>收藏</a>");
  556. favBtnHtml.appendTo(optionsWrap);
  557. favBtnHtml.bind('click', function () {
  558. });
  559. }
  560. if (!options.onlyShow) {
  561. var closeBtnHtml = $("<a class='close_abtntd'>关闭</a>");
  562. closeBtnHtml.appendTo(optionsWrap);
  563. closeBtnHtml.bind('click', function () {
  564. options.closeCallback();
  565. modValue.thematicControlHtml.remove();
  566. })
  567. }
  568. modValue.thematicControlHtml.appendTo($('#thematicControlContent'));
  569. };
  570. function removeCurrentOverLayer() {
  571. if (modValue.currentOverLayerGuid) {
  572. modValue.thematicControlHtml.remove();
  573. map23DControl.tileLayer({
  574. action: 'remove',
  575. guid: modValue.currentOverLayerGuid
  576. })
  577. modValue.currentOverLayerGuid = null;
  578. // map2DViewer.map.removeControl(overLayerOpacityControl);
  579. overLayerOpacityControl = null;
  580. }
  581. ONEMAP.D.overLayerCount--;
  582. if (ONEMAP.D.overLayerCount == 0) {
  583. map2DViewer.map.setZoomScope(1, 19);
  584. }
  585. }
  586. function removeCurrentOverLayerGai(guid) {
  587. if (guid) {
  588. modValue.thematicControlHtml.remove();
  589. map23DControl.tileLayer({
  590. action: 'remove',
  591. guid: guid
  592. })
  593. guid = null;
  594. // map2DViewer.map.removeControl(overLayerOpacityControl);
  595. overLayerOpacityControl = null;
  596. }
  597. ONEMAP.D.overLayerCount--;
  598. if (ONEMAP.D.overLayerCount == 0) {
  599. map2DViewer.map.setZoomScope(1, 19);
  600. }
  601. }
  602. //按钮绑定事件
  603. function bindSxPlayEvents() {
  604. timeChangeEvent(0);
  605. var proWidth = $(".sx-video-progress").width();
  606. var vtiLength = parseInt($(".sx-video-progress-lasttime").text());
  607. for (var i = 0; i < vtiLength; i++) {
  608. video_stus.vti.push(i + 1);
  609. }
  610. video_stus.perTime = proWidth / (video_stus.vti.length - 1);
  611. //上一个
  612. $(".sx-video-btn-back").off("click").on("click", function () {
  613. back();
  614. });
  615. //播放
  616. $(".sx-video-btn-play").off("click").on("click", function () {
  617. if (!video_stus.intervalId) { //播放
  618. play();
  619. } else { //暂停
  620. stop();
  621. }
  622. });
  623. //下一个
  624. $(".sx-video-btn-next").off("click").on("click", function () {
  625. next();
  626. });
  627. //进度轴时间点
  628. $(".sx-video-progress_btn").off("mousedown").on("mousedown", function (event) {
  629. stop();
  630. var yuanleft = 0;
  631. var leftVal = event.clientX - this.offsetLeft - event.offsetX;
  632. var width = $(".sx-video-progress").width();
  633. var pt = video_stus.perTime / 2;
  634. document.onmousemove = function (event) {
  635. var event = event || window.event;
  636. yuanleft = event.clientX - leftVal;
  637. if (yuanleft < 0) yuanleft = 0;
  638. if (yuanleft > width) yuanleft = width;
  639. var index = ((yuanleft + pt) / video_stus.perTime) >> 0;
  640. if (index != video_stus.nowPage) setVti(index);
  641. window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
  642. }
  643. document.onmouseup = function () {
  644. document.onmousemove = null; //弹起鼠标不做任何操作
  645. }
  646. })
  647. }
  648. function next() {
  649. stop(); //点击下一时次按钮时,先停止播放
  650. setVti(video_stus.nowPage + 1);
  651. }
  652. function back() {
  653. stop(); //点击上一时次按钮时,先停止播放
  654. setVti(video_stus.nowPage - 1);
  655. }
  656. var restart = false;
  657. function play() {
  658. if (restart) {
  659. video_stus.nowPage = 0;
  660. $(".sx-video-progress_btn").css("left", -10 + "px");
  661. $(".sx-video-progress-nowtime").html(1);
  662. $("#wrapper .sx-title-left-c .time").html(video_stus.qbTime[0]);
  663. timeChangeEvent(0);
  664. restart = false;
  665. }
  666. if (video_stus.nowPage == video_stus.vti.length - 1) return;
  667. if (video_stus.intervalId) stop();
  668. $(".sx-video-btn-play").removeClass("sx-video-play-img");
  669. $(".sx-video-btn-play").addClass("sx-video-parse-img");
  670. video_stus.intervalId = window.setInterval(playNext, video_stus.intervalTime);
  671. }
  672. function playNext() {
  673. setVti(video_stus.nowPage + 1);
  674. if (video_stus.nowPage >= video_stus.vti.length - 1) {
  675. stop();
  676. restart = true;
  677. return;
  678. }
  679. }
  680. function stop() {
  681. if (!video_stus.intervalId) return;
  682. $(".sx-video-btn-play").removeClass("sx-video-parse-img");
  683. $(".sx-video-btn-play").addClass("sx-video-play-img");
  684. clearInterval(video_stus.intervalId);
  685. video_stus.intervalId = null;
  686. }
  687. function setVti(index) { //设置当前显示的vti
  688. // console.log(index);
  689. // console.log(video_stus.perTime)
  690. if (isNaN(index)) index = 0;
  691. if (index >= video_stus.vti.length) return;
  692. if (index < 0) return;
  693. video_stus.nowPage = index;
  694. video_stus.x = video_stus.nowPage * video_stus.perTime;
  695. $(".sx-video-progress_btn").css("left", video_stus.x - 12);
  696. $(".sx-video-progress-nowtime").html(video_stus.vti[video_stus.nowPage]);
  697. $(".sx-title-left-c span.time").html(video_stus.qbTime[index]);
  698. btnDisabled();
  699. timeChangeEvent(index);
  700. }
  701. //调整按钮样式
  702. function btnDisabled() {
  703. if (video_stus.nowPage > 0) {
  704. $(".sx-video-btn-next").removeClass("sx-video-next-img");
  705. $(".sx-video-btn-next").addClass("sx-video-next-img-blue");
  706. $(".sx-video-btn-back").removeClass("sx-video-back-img");
  707. $(".sx-video-btn-back").addClass("sx-video-back-img-blue");
  708. if (video_stus.nowPage >= video_stus.vti.length - 1) {
  709. $(".sx-video-btn-next").removeClass("sx-video-next-img-blue");
  710. $(".sx-video-btn-next").addClass("sx-video-next-img");
  711. }
  712. } else {
  713. $(".sx-video-btn-next").removeClass("sx-video-next-img");
  714. $(".sx-video-btn-next").addClass("sx-video-next-img-blue");
  715. $(".sx-video-btn-back").removeClass("sx-video-back-img-blue");
  716. $(".sx-video-btn-back").addClass("sx-video-back-img");
  717. }
  718. }
  719. //加载图像
  720. function timeChangeEvent(index) {
  721. // 大兴机场示例
  722. var layerLength = ONEMAP.M.myLayers.checkLength();
  723. if (layerLength < map23DConfig.layerMaxLength) {
  724. var url2D = video_stus.urls[index] + '?l={z}&x={x}&y={y}';
  725. var vguid = video_stus.urls[index].split("v1.0/")[1];
  726. var vname = $("#wrapper .sx-title-left-c .title").text();
  727. if (index == 0 && $("#layerControlMenu .sxlayer").length < 1) {
  728. modValue.currentOverLayerGuid = map23DControl.tileLayer({
  729. action: 'add',
  730. layer: {
  731. url2D: url2D,
  732. url3D: url2D,
  733. imageType: 'png',
  734. name: vname,
  735. minZoom: 1,
  736. maxZoom: 19,
  737. guid: vguid
  738. }
  739. })
  740. map23DControl.setView({
  741. center: {
  742. lat: video_stus.data.center.lat,
  743. lng: video_stus.data.center.lng
  744. },
  745. zoom: video_stus.data.zoom,
  746. tilt: 0
  747. });
  748. // 添加到我的图层
  749. var options = {
  750. action: "add",
  751. DOM: {
  752. guid: modValue.currentOverLayerGuid,
  753. type: 'sxlayer',
  754. name: vname
  755. },
  756. mod: 'sxlayer'
  757. }
  758. modValue.DOMid = ONEMAP.M.myLayers.myLayerControl(options);
  759. bindEvent();
  760. ONEMAP.C.publisher.subscribe(layerAction, options.DOM.guid);
  761. } else {
  762. map23DControl.tileLayer({
  763. action: 'update',
  764. layer: {
  765. url2D: url2D,
  766. url3D: url2D,
  767. imageType: 'png',
  768. name: vname,
  769. minZoom: 18,
  770. maxZoom: 19,
  771. guid: vguid
  772. },
  773. guid: modValue.currentOverLayerGuid
  774. })
  775. }
  776. video_stus.guids.push(modValue.currentOverLayerGuid);
  777. } else {
  778. // $(this).find(".meun-checkBox").removeClass("menu-select").addClass("menu-select-no");
  779. ONEMAP.C.publisher.publish({
  780. type: 'warning',
  781. message: '图层数量已达上限'
  782. }, 'noteBar::add');
  783. return false;
  784. }
  785. }
  786. /**
  787. * 设置界面
  788. */
  789. function setLayout() {
  790. }
  791. /**
  792. * 界面重置
  793. * @return {[type]} [description]
  794. */
  795. function layoutResize(options) {
  796. if (options.modName != "heaven") {
  797. remove();
  798. } else {
  799. if (status.isShowChild) {
  800. remove();
  801. $("#menu #heaven").removeClass('active');
  802. } else {
  803. $("#menu #heaven").addClass('active');
  804. status.isShowChild = true;
  805. }
  806. }
  807. }
  808. /**
  809. * 模块移除
  810. * @return {[type]} [description]
  811. */
  812. function remove() {
  813. //取消订阅
  814. unSubscribe();
  815. $("#menu #heaven").removeClass('active');
  816. status.isShowChild = false;
  817. }
  818. /**
  819. * 注册订阅
  820. * @type {Function}
  821. * 推送:ONEMAP.C.publisher.publish(options,'moduleName::type');
  822. * 订阅:ONEMAP.C.publisher.subscribe(layoutResize,'sideBarLayoutChange');
  823. */
  824. function subscribe() {
  825. ONEMAP.C.publisher.subscribe(layoutResize, 'menuListClick');
  826. ONEMAP.C.publisher.subscribe(removeSxLayer, 'cleanMap');
  827. }
  828. /**
  829. * 取消订阅
  830. * @type {Function}
  831. * 取消订阅:ONEMAP.C.publisher.unSubscribe(layoutResize,'sideBarLayoutChange');
  832. */
  833. function unSubscribe() {
  834. }
  835. // 监听图层操作动作
  836. function layerAction(options) {
  837. // console.log(options);
  838. // console.log(modValue.ids);
  839. if (options.action == "remove") {
  840. // console.log("remove");
  841. removeLayer(options.guid);
  842. } else if (options.action == "opacity") {
  843. var opt = options.options.opacity;
  844. setOpacity(options.guid, opt);
  845. } else if (options.action == "up" || options.action == "down") {
  846. ONEMAP.M.myLayerActions.changeFloor();
  847. }
  848. }
  849. // 更改层级
  850. function changeFloor() {
  851. var li = $("#layerControlMenu .myLayers .mn-content li");
  852. var layer = $("#mapHolder #map2DWrap .leaflet-layer");
  853. var liLength = li.length;
  854. var zidArr = new Array();
  855. for (var i = 0; i < liLength; i++) {
  856. zidArr.push(li.eq(i).attr("zid"));
  857. for (var j = 0; j < layer.length; j++) {
  858. if (layer.eq(j).attr("zid") == zidArr[i]) {
  859. layer.eq(j).css("z-index", layer.length - i);
  860. }
  861. }
  862. }
  863. }
  864. // 设置透明度
  865. function setOpacity(zid, opt) {
  866. map23DControl.tileLayer({
  867. action: 'update',
  868. guid: zid,
  869. layer: {
  870. opacity: opt
  871. }
  872. })
  873. }
  874. // 添加图层
  875. function addLayer(data) {
  876. $("#layerControlMenu .mn-content p.tip-none").hide();
  877. //添加到23D地图上
  878. modValue.currentOverLayerGuid = map23DControl.tileLayer({
  879. action: 'add',
  880. layer: {
  881. url2D: onemapUrlConfig.thematicTileUrl + '/' + data.guid + '?l={z}&x={x}&y={y}',
  882. url3D: onemapUrlConfig.thematicTileFo3DUrl + '/' + data.guid + '?z=%d&x=%d&y=%d',
  883. minZoom: data['min_zoom'],
  884. maxZoom: data['max_zoom'],
  885. maxNativeZoom: data['max_zoom'],
  886. attribution: '',
  887. opacity: 1,
  888. imageType: 'png',
  889. name: data.name,
  890. guid: data.guid
  891. }
  892. })
  893. map23DControl.setView({
  894. center: {
  895. lat: data['center_lat'],
  896. lng: data['center_lon']
  897. },
  898. zoom: data['zoom']
  899. })
  900. map2DViewer.map.setZoomScope(data['min_zoom'], data['max_zoom']);
  901. }
  902. // 移除图层
  903. function removeLayer(data) {
  904. if (data) {
  905. if (modValue.thematicControlHtml) {
  906. modValue.thematicControlHtml.remove();
  907. }
  908. map23DControl.tileLayer({
  909. action: 'remove',
  910. guid: data
  911. })
  912. data = null;
  913. // map2DViewer.map.removeControl(overLayerOpacityControl);
  914. overLayerOpacityControl = null;
  915. $(".shixu-time-box").hide();
  916. }
  917. ONEMAP.D.overLayerCount--;
  918. if (ONEMAP.D.overLayerCount == 0) {
  919. map2DViewer.map.setZoomScope(1, 19);
  920. }
  921. }
  922. // // 更改层级
  923. // function changeFloor(){
  924. // var li = $("#layerControlMenu .myLayers .mn-content li");
  925. // var layer = $("#mapHolder #map2DWrap .leaflet-layer");
  926. // var liLength = li.length;
  927. // var zidArr = new Array();
  928. // for(var i=0;i<liLength;i++){
  929. // zidArr.push(li.eq(i).attr("zid"));
  930. // for(var j=0;j<layer.length;j++){
  931. // if(layer.eq(j).attr("zid") == zidArr[i]){
  932. // layer.eq(j).css("z-index",layer.length-i);
  933. // }
  934. // }
  935. // }
  936. // }
  937. return ONEMAP.M.heaven = {
  938. init: init
  939. }
  940. });