/** * [ONEMAP.M.side_nav] * @return {[object]} */ define([ 'html!templates/sideNavMapControl', 'modDir/service/cartodbParse', 'css!styles/sideNavMapControl', 'modDir/gcms/gcmsEvents' ], function (tplSideNavMapControl, cartodbParseF) { /** * 模块数据 用于数据存储和外部调用 * @type {Object} * 数据存放 */ var modValue = { currentOverLayerGuid: null, DEMguid: null } var status = { showSideNavMapControl: false, curMap2Dstatus: true, isAdd3d: false, sideNavLock: true } var overLayerOpacityControl; function init() { setLayout(); bindEvent(); setDixingList(); //setIGList(); subscribe(); }; function setLayout() { $(tplSideNavMapControl).appendTo($("#sideNav .cover-content")); if (ONEMAP.D.globalSettingData) { switch (ONEMAP.D.globalSettingData.baseMap2D.type) { case 1: $("#mapBaseLayerControl .choosemap .map-list li[mId='gm']").children('.biankuang').addClass('mapchoose'); break; case 2: $("#mapBaseLayerControl .choosemap .map-list li[mId='gr']").children('.biankuang').addClass('mapchoose'); $('#mapBaseLayerControl .show-name').show(); $("#sideNavMapControl .abtn-show-name").addClass('active'); break; case 3: $("#mapBaseLayerControl .choosemap .map-list li[mId='gt']").children('.biankuang').addClass('mapchoose'); break; } } $("#sideNavMapControl .ii-body").mCustomScrollbar({ scrollInertia: 1000 }); if (navigator.userAgent.toLowerCase().match(/chrome/) != null || navigator.userAgent.toLowerCase().match(/firefox/) != null) { $('#map23dChangeNav .change_2d').remove(); $('#map23dChangeNav .change_3d').remove(); } } function layoutResize() {}; function changemapStyle(mapStyle) { if (mapStyle == '2D') { if (!map23DData.display.map2D) { show2dMap(); } } if (mapStyle == '3D') { if (!map23DData.display.map3D) { show3dMap(); } } } function subscribe() { ONEMAP.C.publisher.subscribe(changemapStyle, 'layout::mapStyle'); ONEMAP.C.publisher.subscribe(closeSideNav, 'layout::sideBar'); ONEMAP.C.publisher.subscribe(closeSideNav, 'mapChange'); ONEMAP.C.publisher.subscribe(controlPointShijing, 'mapChange23D'); }; function controlPointShijing(zoom) { if (zoom > 13) { $("#sideNavMapControl .abtn-show-pointshijing").show(); } else { $("#sideNavMapControl .abtn-show-pointshijing").hide(); $("#sideNavMapControl .abtn-show-pointshijing").removeClass('active'); ONEMAP.C.publisher.publish('hide', 'pointShijing'); } } function closeSideNav(options) { if (!status.sideNavLock) { $('#sideNavMapControl').hide(); $('#mapLayerControl').removeClass('open'); status.showSideNavMapControl = false; changeMapLayerControl(); } }; //地图导航栏图标变化 function changeMapLayerControl() { return } function show2dMap() { map23DControl.show2D(); //ONEMAP.C.publisher.publish('showGM', 'layout::mapStyle'); $("#topBar .total-content .tools-tool23Dchange").removeClass('map3D') $("#topBar .total-content .tools-tool23Dchange").addClass('map2D'); $($(".leaflet-control-scale-line")[0]).show(); if (!status.curMap2Dstatus) { status.curMap2Dstatus = true; ONEMAP.M.toolsBar.layoutResize(); $("#chooseBg .choosemap").removeClass('tDClass'); } ONEMAP.C.publisher.publish('2d', 'change23D'); map2DViewer.map.fire('mainLayer:addLayer'); } function show3dMap() { $("#layerControlMenu").bind("mousemove", function () { if (parseFloat($(this).css("top")) > 0) { $(this).css("bottom", "auto"); } }) if (Detector.webgl) { map23DControl.show3D(); } else { ONEMAP.C.publisher.publish({ type: "warning", message: "本浏览器不支持webGL,请更换重试!" }, 'noteBar::add'); return } //ONEMAP.C.publisher.publish('showGH', 'layout::mapStyle'); $("#topBar .total-content .tools-tool23Dchange").removeClass('map2D') $("#topBar .total-content .tools-tool23Dchange").addClass('map3D'); $($(".leaflet-control-scale-line")[0]).hide(); if (!status.tdmapStatus) { modValue.mapChangeTimer = (new Date()).getTime(); if (!status.isAdd3d) { ONEMAP.C.publisher.publish('3D', 'add3d'); status.isAdd3d = true; } // setTimeout(function () { // // locaSpaceMap.attachEvent('FireSceneMouseMove', FireSceneMouseMove) // }, 2000) status.tdmapStatus = true; } if (status.curMap2Dstatus) { status.curMap2Dstatus = false; ONEMAP.M.toolsBar.layoutResize(); $("#sideLink3dData").css({ display: 'inline' }); $("#chooseBg .choosemap").addClass('tDClass'); $("#sideNavMapControl .abtn-show-DEMTD").show(); } ONEMAP.C.publisher.publish('3d', 'change23D'); } function bindEvent() { //单点实景控制 $("#sideNavMapControl .abtn-show-pointshijing").bind('click', function () { if ($("#sideNavMapControl .abtn-show-pointshijing").hasClass('active')) { $("#sideNavMapControl .abtn-show-pointshijing").removeClass('active'); ONEMAP.C.publisher.publish('hide', 'pointShijing'); } else { $("#sideNavMapControl .abtn-show-pointshijing").addClass('active'); ONEMAP.C.publisher.publish('show', 'pointShijing'); }; }) //控制地图导航栏显隐 $('#mapLayerControl').bind('click', function () { if (!status.showSideNavMapControl) { $('#sideNavMapControl').show(); $(this).addClass('open'); status.showSideNavMapControl = true; } else { $('#sideNavMapControl').hide(); $(this).removeClass('open'); status.showSideNavMapControl = false; } changeMapLayerControl(); }); //专题图层或重要目标与事件操作 $(".userThematic-ii-header h4").bind('click', function () { $("#userThematic").show(); $("#userIG").hide(); $(".userThematic-ii-header").removeClass('nochoose'); $(".userIG-ii-header").addClass('nochoose'); }) $(".userIG-ii-header h4").bind('click', function () { $("#userIG").show(); $("#userThematic").hide(); $(".userThematic-ii-header").addClass('nochoose'); $(".userIG-ii-header").removeClass('nochoose'); }) $(".userThematic-ii-header .itemControl").bind('click', function () { $("#userThematic").show(); $("#userThematic").find('.sectionbg').addClass('open'); $("#userThematic").find('.linkContent').show(); $(".userThematic-ii-header").removeClass('nochoose'); $(".userIG-ii-header").addClass('nochoose'); $("#userIG").find('.sectionbg').removeClass('open'); $("#userIG").find('.linkContent').hide(); $("#userIG").hide(); }) $(".userIG-ii-header .itemControl").bind('click', function () { $("#userIG").show(); $("#userIG").find('.sectionbg').addClass('open'); $("#userIG").find('.linkContent').show(); $(".userThematic-ii-header").addClass('nochoose'); $(".userIG-ii-header").removeClass('nochoose'); $("#userThematic").find('.sectionbg').removeClass('open'); $("#userThematic").find('.linkContent').hide(); $("#userThematic").hide(); }) //显示2D $('#map23dChangeNav .change_2d').bind('click', function () { $(this).addClass('current'); $('#map23dChangeNav .change_3d').removeClass('current'); show2dMap(); changeMapLayerControl(); }) //显示3D $('#map23dChangeNav .change_3d').bind('click', function () { $(this).addClass('current'); $('#map23dChangeNav .change_2d').removeClass('current'); show3dMap(); changeMapLayerControl(); }) //显示经纬网 $("#sideNavMapControl .abtn-show-STLayer").bind("click", function () { if ($(this).hasClass('active')) { ONEMAP.C.publisher.publish('hide', 'mapHolder::STLatLngLayer'); $(this).removeClass('active'); } else { ONEMAP.C.publisher.publish('show', 'mapHolder::STLatLngLayer'); $(this).addClass('active'); } }); //显示地名层 $("#sideNavMapControl .abtn-show-name").bind("click", function () { if ($(this).hasClass('active')) { map2DViewer.setDefaultTileLayer('gr'); if (map3DViewer.inited && modValue.NAMEguid) { map3DViewer.layers[modValue.NAMEguid].Visible = false; } $(this).removeClass('active'); } else { map2DViewer.setDefaultTileLayer('gr'); if (map3DViewer.inited && modValue.NAMEguid) { map3DViewer.layers[modValue.NAMEguid].Visible = true; } $(this).addClass('active'); } }) //显示三维DEM $("#sideNavMapControl .abtn-show-DEMTD").bind("click", function () { if ($(this).hasClass('active')) { map3DViewer.layers[modValue.DEMguid].Visible = false; $(this).removeClass('active'); } else { map3DViewer.layers[modValue.DEMguid].Visible = true; $(this).addClass('active'); } }) //专题地图更多 $(".morethematicmap").bind("click", function () { require(['modDir/atlas/atlasList'], function (atlasList) { atlasList.init(); }); }); //GCMS $("#sideNavMapControl .btn-gcms").bind("click", function () { require(['modDir/gcms/gcmsNav'], function (gcmsNav) { gcmsNav.init(); }); }); //用户手册 $("#sideNavMapControl .abtn-user-help").bind('click', function () { require(['modDir/user/userHelp'], function (userHelp) { userHelp.init(); }); }); //海量地图库 $("#sideNavMapControl .btn-atals-labrary").bind("click", function () { var windowOpen = window.open(); var openUrl = onemapUrlConfig.atlasLibraryUrl; windowOpen.location = openUrl; }); //更多专题地图 $('.side-nav-map-control-content .info-content .abtn-more').bind('click', function () { //开启侧栏 ONEMAP.C.publisher.publish('show', 'layout::sideBar'); if ($(".userThematic-ii-header").hasClass('nochoose')) { require(['modDir/gcms/gcmsNav'], function (gcmsNav) { gcmsNav.init(); }); } else { require(['modDir/atlas/atlasList'], function (atlasList) { atlasList.init(); }); } }); //登录系统 $('#sideNavMapControl .login_in').bind('click', function () { ONEMAP.C.gotoLogin(); }); //退出系统 $("#sideNavMapControl .login_out").bind('click', function () { ONEMAP.C.logout(); }); $("#sideNavMapControl .sideNavLock").bind('click', function () { if ($('#sideNavMapControl .sideNavLock').hasClass('close')) { $('#sideNavMapControl .sideNavLock').removeClass('close'); status.sideNavLock = false; } else { $('#sideNavMapControl .sideNavLock').addClass('close'); status.sideNavLock = true; } }) //管理面板入口 $('.manage-link .show-link').bind('click', function () { $('#manageLink').toggle('fast'); }); $('#manageLink .go-user-manage').bind('click', function () { $('#manageLink').toggle('fast'); var windowOpen = window.open(); var openUrl = onemapUrlConfig.userManageSiteUrl; windowOpen.location = openUrl; }); $('#manageLink .go-gcms').bind('click', function () { $('#manageLink').toggle('fast'); var windowOpen = window.open(); var openUrl = onemapUrlConfig.gcmsSiteUrl; windowOpen.location = openUrl; }); $('#manageLink .go-hmdms').bind('click', function () { $('#manageLink').toggle('fast'); var windowOpen = window.open(); var openUrl = onemapUrlConfig.hmdmsSiteUrl; windowOpen.location = openUrl; }); } function FireSceneMouseMove(e, sender, x, y) { var point2d = locaSpaceMap.CreatePoint2d(); point2d.SetValue(x, y); point2d = locaSpaceMap.Globe.ScreenToScene(point2d); var latlng = { lat: point2d.Y, lng: point2d.X }; var nLatlng = L.Util.formatHMS(latlng); $('#pointInfo').empty().append('经度:' + nLatlng.lng + ' 纬度:' + nLatlng.lat); if ((new Date()).getTime() - modValue.mapChangeTimer > 6000) { modValue.mapChangeTimer = (new Date()).getTime(); ONEMAP.C.publisher.publish({}, 'mapChange'); ONEMAP.C.publisher.publish({}, 'layout::sideBar'); } var cameraState = locaSpaceMap.Globe.CameraState; if (cameraState.Distance < 80000) { if (modValue.countryBoundaryLayer) { if (modValue.countryBoundaryLayer.Visible) { modValue.countryBoundaryLayer.Visible = false; modValue.provinceLayer.Visible = false; //map3DViewer.layers[modValue.boundaryGuid].Visible = false; } } } else { if (modValue.countryBoundaryLayer) { if (!modValue.countryBoundaryLayer.Visible) { modValue.countryBoundaryLayer.Visible = true; modValue.provinceLayer.Visible = true; //map3DViewer.layers[modValue.boundaryGuid].Visible = true; } } } } //添加地形图组 function setDixingList() { var category = ONEMAP.D.globalSettingData.map2DThematicCategory; for (var i = 0; i < category.length; i++) { var liHtml = $('
' + category[i] + '
') var linkcontent = $(''); $(ONEMAP.D.globalSettingData.map2DThematicSetting).each(function (index, el) { if (el.category === category[i]) { var thematicLink = $(''); thematicLink.bind('click', el, function (e) { if ($(this).hasClass('selected')) { removeCurrentOverLayer(); $(this).removeClass('selected'); if (ONEMAP.M.toolWeatherMap) { ONEMAP.M.toolWeatherMap.remove(); } } else { if (ONEMAP.M.toolWeatherMap) { ONEMAP.M.toolWeatherMap.remove(); } removeCurrentOverLayer(); if (e.data.type === "weatherMap") { //获取云图图集列表数据 var weatherData; $.ajax({ type: 'get', dataType: 'jsonp', url: el.productUrl + '/production/product_category?production_id=' + el.guid, beforeSend: ONEMAP.V.loading.load(), success: function (data) { weatherData = data; //添加云图控件 addWeatherControl(weatherData, e.data); }, error: function (data) { //console.log("有点小失败"); }, completer: ONEMAP.V.loading.loaded() }) $('#userThematicList .selected').removeClass('selected'); $(this).addClass('selected'); } else if (e.data.type === "thematicOrigin") { url2D = e.data.url + '/' + e.data.guid + '?l={z}&x={x}&y={y}'; url3D = e.data.url + '/' + e.data.guid + '?z=%d&x=%d&y=%d'; modValue.currentOverLayerGuid = map23DControl.tileLayer({ action: 'add', layer: { url2D: url2D, url3D: url3D, imageType: 'png', name: e.data.name, minZoom: e.data.min_zoom || 1, maxZoom: e.data.max_zoom || 19, guid: e.data.guid } }) //S 优化 //添加图层透明度控件 overLayerOpacityControl = new L.Control.LayerOpacity( map2DViewer.layers[modValue.currentOverLayerGuid], { showFavBtn: false, closeCallback: function () { removeCurrentOverLayer(); $('#userThematicList .selected').removeClass('selected'); } } ).addTo(map2DViewer.map); thematicControl( map2DViewer.layers[modValue.currentOverLayerGuid], { data: e.data, showFavBtn: false, closeCallback: function () { removeCurrentOverLayer(); $('#userThematicList .selected').removeClass('selected'); } }) ONEMAP.D.overLayerCount++; map2DViewer.map.setZoomScope(e.data['min_zoom'], e.data['max_zoom']); map23DControl.setView({ center: { lat: e.data['center'].lat, lng: e.data['center'].lng }, zoom: e.data['zoom'], tilt: 0 }) $('#userThematicList .selected').removeClass('selected'); $(this).addClass('selected'); //E 优化 } else if (e.data.type === "vectorOrigin") { var cartodbF = new cartodbParseF(); cartodbF.getVizInfo({ vizUrl: e.data['url'] }, function (tileData) { var tdTileLayerUrl = tileData['templateUrl'].replace('{z}/{x}/{y}', '%d/%d/%d'); modValue.currentOverLayerGuid = map23DControl.tileLayer({ action: 'add', layer: { url2D: tileData['templateUrl'], url3D: tdTileLayerUrl, imageType: 'png', name: e.data.name, minZoom: e.data.min_zoom || 1, maxZoom: e.data.max_zoom || 19 } }) map2DViewer.layers[modValue.currentOverLayerGuid]['utfgrids'] = []; //添加utfgrid _.each(tileData.utfgridUrl, function (el, index) { var aGridLayer = new L.UtfGrid(el + '?callback={cb}'); map2DViewer.layers[modValue.currentOverLayerGuid]['utfgrids'].push(aGridLayer); aGridLayer.layerNum = index; aGridLayer.on('click', function (e) { L.DomEvent.stopPropagation(e); if (e.data) { var layerNum = e.target._map._layers[e.target._leaflet_id].layerNum; $.ajax({ url: tileData.serverApiUrl + '/v1/map/' + tileData.layergroupid + '/' + layerNum + '/attributes/' + e.data.cartodb_id, type: 'GET', dataType: 'jsonp' }) .done(function (data) { if (data) { var popupContent = $('
'); _.each(data, function (pel, pindex) { popupContent.append('
' + pindex + ':' + pel + '
') }); var popup = L.popup() .setLatLng(e.latlng) .setContent(popupContent.get(0)) .openOn(map2DViewer.map); } }); } }); aGridLayer.addTo(map2DViewer.map); }); //S 优化 //添加图层透明度控件 overLayerOpacityControl = new L.Control.LayerOpacity( map2DViewer.layers[modValue.currentOverLayerGuid], { showFavBtn: false, closeCallback: function () { if (map2DViewer.layers[modValue.currentOverLayerGuid]['utfgrids'].length > 0) { _.each(map2DViewer.layers[modValue.currentOverLayerGuid]['utfgrids'], function (lel) { map2DViewer.map.removeLayer(lel); }); } removeCurrentOverLayer(); $('#userThematicList .selected').removeClass('selected'); } } ).addTo(map2DViewer.map); thematicControl( map2DViewer.layers[modValue.currentOverLayerGuid], { data: e.data, showFavBtn: false, closeCallback: function () { removeCurrentOverLayer(); $('#userThematicList .selected').removeClass('selected'); } }) ONEMAP.D.overLayerCount++; map2DViewer.map.setZoomScope(e.data['min_zoom'], e.data['max_zoom']); map23DControl.setView({ center: { lat: e.data['center'].lat, lng: e.data['center'].lng }, zoom: e.data['zoom'], tilt: 0 }) $('#userThematicList .selected').removeClass('selected'); $(this).addClass('selected'); //E 优化 }); } else { var tdTileLayerUrl = e.data['url'].replace('?x={x}&y={y}&z={z}', '?z=%d&x=%d&y=%d'); tdTileLayerUrl = tdTileLayerUrl.replace('?z={z}&x={x}&y={y}', '?z=%d&x=%d&y=%d'); tdTileLayerUrl = tdTileLayerUrl.replace('{z}/{y}/{x}', '%d/%d/%d'); modValue.currentOverLayerGuid = map23DControl.tileLayer({ action: 'add', layer: { url2D: e.data['url'], url3D: tdTileLayerUrl, imageType: 'png', name: e.data.name, minZoom: e.data.min_zoom || 1, maxZoom: e.data.max_zoom || 19 } }) //S 优化 //添加图层透明度控件 overLayerOpacityControl = new L.Control.LayerOpacity( map2DViewer.layers[modValue.currentOverLayerGuid], { showFavBtn: false, closeCallback: function () { removeCurrentOverLayer(); $('#userThematicList .selected').removeClass('selected'); } } ).addTo(map2DViewer.map); thematicControl( map2DViewer.layers[modValue.currentOverLayerGuid], { data: e.data, showFavBtn: false, closeCallback: function () { removeCurrentOverLayer(); $('#userThematicList .selected').removeClass('selected'); } }) ONEMAP.D.overLayerCount++; map2DViewer.map.setZoomScope(e.data['min_zoom'], e.data['max_zoom']); map23DControl.setView({ center: { lat: e.data['center'].lat, lng: e.data['center'].lng }, zoom: e.data['zoom'], tilt: 0 }) $('#userThematicList .selected').removeClass('selected'); $(this).addClass('selected'); //E 优化 } } }); thematicLink.appendTo(linkcontent); } }); liHtml.find('.sectionbg').bind('click', function () { $(this).parent().find('.linkContent').toggle(); if ($(this).hasClass('open')) { $(this).removeClass('open'); } else { $(this).addClass('open'); $(this).parent().siblings().find('.linkContent').hide(); $(this).parent().siblings().find('.sectionbg').removeClass('open'); } }) linkcontent.appendTo(liHtml); liHtml.appendTo($("#userThematicList")); } $("#userThematicList section").eq(0).find('.linkContent').show(); $("#userThematicList section").eq(0).find('.sectionbg').addClass('open'); //更新滚动条 $('#userThematic .ii-body').mCustomScrollbar('update'); } //添加云图控件 function addWeatherControl(weatherData, elData) { var weatherMapData = []; $.each(weatherData.category[0].list, function (i, t) { var itemData = {}; itemData.datetime = t.name; itemData.layerUrl = elData.url + '/' + t.guid + '?z={z}&x={x}&y={y}' weatherMapData.push(itemData); }) map23DControl.setView({ center: { lat: elData['center'].lat, lng: elData['center'].lng }, zoom: elData['zoom'], tilt: 0 }) require(['modDir/tools/toolWeatherMap'], function (toolWeatherMap) { toolWeatherMap.init({ weatherMapData: weatherMapData }); }); } //添加三维专题图控制条 function thematicControl(layer, options) { modValue.thematicControlHtml = $("
" + "" + "
"); var cover_content = $("
"); cover_content.appendTo(modValue.thematicControlHtml); if (options.showFavBtn || !options.onlyShow) { var optionsWrap = $("
"); optionsWrap.appendTo(cover_content); } $("
名称:" + options.data.name + "
").appendTo(cover_content); if (options.atlas) { var atlasHtml = $("详情"); atlasHtml.appendTo(optionsWrap); atlasHtml.bind('click', function () { }); } if (options.showFavBtn) { var favBtnHtml = $("收藏"); favBtnHtml.appendTo(optionsWrap); favBtnHtml.bind('click', function () { }); } if (!options.onlyShow) { var closeBtnHtml = $("关闭"); closeBtnHtml.appendTo(optionsWrap); closeBtnHtml.bind('click', function () { options.closeCallback(); modValue.thematicControlHtml.remove(); }) } modValue.thematicControlHtml.appendTo($('#thematicControlContent')); }; function removeCurrentOverLayer() { if (modValue.currentOverLayerGuid) { modValue.thematicControlHtml.remove(); map23DControl.tileLayer({ action: 'remove', guid: modValue.currentOverLayerGuid }) modValue.currentOverLayerGuid = null; map2DViewer.map.removeControl(overLayerOpacityControl); overLayerOpacityControl = null; } ONEMAP.D.overLayerCount--; if (ONEMAP.D.overLayerCount == 0) { map2DViewer.map.setZoomScope(1, 19); } } return ONEMAP.M.sideNav = { init: init, show3dMap: show3dMap, show2dMap: show2dMap, modValue: modValue }; })