L.Control.LeadorStreetView = L.Control.extend({ //是否初始化 _initialized:false, _isShow:false, _isLoad:false, streetLayerGuid:null, streetMarkerGuid:null, options:{ position:'topleft', autoZIndex:true, state:false, onFunc:null, offFunc:null }, initialize:function(options){ L.setOptions(this, options); return this; }, onAdd:function(map){ var _this = this; _this._map = map; ONEMAP.C.publisher.subscribe(_this.updateMarker23D,'change23D'); _this._createControl(); return _this._container; }, /** * 创建冒泡窗 */ _creatPopupHtml:function(options){ var popupHtml = '' return popupHtml; }, _vieModalHtml:''+ '
'+ ''+ '
', _createControl:function(){ var _this = this; _this._container = L.DomUtil.create('div','leaflet-bar leaflet-control-leador-street-view'); L.DomEvent.on(_this._container, 'contextmenu', L.DomEvent.stopPropagation); var link = L.DomUtil.create('a','leaflet-control-leador-street-view-link', this._container); L.DomUtil.create('span','',link); link.title = '路网实景'; _this._viewModal = L.DomUtil.create('div','modal'); _this._viewModal.id = 'leadorStreetViewModal'; _this._viewModal.innerHTML = _this._vieModalHtml; document.body.appendChild(_this._viewModal); L.DomEvent .on(link, 'click', L.DomEvent.stopPropagation) .on(link, 'click', L.DomEvent.preventDefault) .on(link,'click', function(){ if(_this._isLoad){ return false; } if(_this.options.state){ _this.options.state = false; _this._map.fire('leadorStreetView:off'); L.DomUtil.removeClass(_this._container,'active'); _this._removeViewMarker(); _this._removeViewRoadTile(); }else{ _this.options.state = true; _this._map.fire('leadorStreetView:on'); _this._buildLeadorSwf(); _this._isLoad = true; setTimeout(function(){ _this._isLoad = false; },1000); L.DomUtil.addClass(_this._container,'active'); //setTimeout(function(){ _this._addViewMarker(); _this._addViewRoadTile(); //},1000); } }); _this._map.on('leadorStreetViewPoint:on cleanMap',function(){ if(_this.options.state){ _this.options.state = false; _this._map.fire('leadorStreetView:off'); L.DomUtil.removeClass(_this._container,'active'); _this._removeViewMarker(); _this._removeViewRoadTile(); } }); }, addShijing:function(){ var _this = this; _this._groupId = ONEMAP.M.heighterControl.modValue.shijingGroup; _this.add3DShijing = true; if(!_this.options.state){ _this.options.state = true; _this._map.fire('leadorStreetView:on'); _this._buildLeadorSwf(); _this._isLoad = true; setTimeout(function(){ _this._isLoad = false; },1000); L.DomUtil.addClass(_this._container,'active'); //setTimeout(function(){ _this._addViewMarker(); _this._addViewRoadTile(); //},1000); //ONEMAP.C.publisher.subscribe(_this.controlMyLayer,'shijikngLayer'); } }, controlShijing:function(){ var _this = this; if(_this.options.state){ _this.options.state = false; _this._map.fire('leadorStreetView:off'); L.DomUtil.removeClass(_this._container,'active'); _this._removeViewMarker(); _this._removeViewRoadTile(); //ONEMAP.C.publisher.unSubscribe(_this.controlMyLayer,'shijikngLayer'); } }, //设置显示和隐藏 show/hide changeStatus:function(type){ var _this = this; switch(type){ case 'show': _this._container.style.left = '60px'; break; case 'hide': _this._container.style.left = '-10000px'; if(_this.options.state){ _this.options.state = false; L.DomUtil.removeClass(_this._container,'active'); _this._removeViewMarker(); _this._removeViewRoadTile(); } break; case 'off': if(_this.options.state){ _this.options.state = false; L.DomUtil.removeClass(_this._container,'active'); _this._removeViewMarker(); _this._removeViewRoadTile(); } break; } }, flashChecker:function(){ var hasFlash = 0; var flashVersion =0; try{ if(document.all){ var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash'); if(swf){ hasFlash = 1; VSwf = swf.GetVariable('$version'); flashVersion = parseInt(VSwf.split(" ")[1].split(",")[0]); } }else { if(navigator.plugins && navigator.plugins.length > 0){ var swf = navigator.plugins["Shockwave Flash"]; } if(swf){ hasFlash = 1; var words = swf.description.split(" "); for(var i=0;i 10){ /** 配置 **/ var more = {}; more.flashvars = {}; LeadorStreetView.useHash = false; /** 设置服务信息 **/ more.flashvars.TrueVisionSeverUrl = onemapUrlConfig.leadorStreetBaseUrl; more.flashvars.Port = onemapUrlConfig.leadorStreetPort; more.flashvars.DataName = onemapUrlConfig.leadorStreetDataName; more.flashvars.TrueVisionImageUrl = onemapUrlConfig.leadorStreetImageUrl; more.flashvars.UIUrl = onemapUrlConfig.leadorStreetLibUrl+"/IShowChinaTVUIBJ.swf"; more.flashvars.LogoUrl = onemapUrlConfig.leadorStreetLibUrl+'/ld-logo.png'; /** 绑定DIV **/ LeadorStreetView.bindingDIV("leadorStreetViewSwf",null,more); LeadorStreetView.showFullScreenUI(false); //位置改变 LeadorStreetView.addCompleteEvent(function(info){ _this._viewMarker.setLatLng([info.lat,info.lon]); _this.updateMarker23D('3d'); if(info.address){ var latlng = new L.latLng(info.lat,info.lon) latlng = L.Util.formatHMS(latlng) var options_popup = { name:info.address, content:'

'+latlng.lng+';'+latlng.lat+'

' } var popupHtml = _this._creatPopupHtml(options_popup); _this._viewMarker.bindPopup(popupHtml).openPopup(); } map3DViewer.marker({ action: 'update', guid:_this.streetMarkerGuid, geojson: { "geometry": { "coordinates": [info.lng, info.lat] } } }) //图标偏移到 左侧中心 // var holderWrap = _this._map.getContainer(); // var aLatLng = new L.LatLng(info.lat,info.lon); // var bPoints = _this._map.project(aLatLng,_this._map.getZoom()); // bPoints.x += (holderWrap.clientWidth/2 - document.getElementById('leadorStreetViewWrap').offsetWidth)/4; // aLatLng = _this._map.unproject(bPoints,_this._map.getZoom()); // _this._map.setView(aLatLng,_this._map.getZoom()); }); //视角改变 LeadorStreetView.addAngleChangeEvent(function(info){ _this._updateViewMarker(parseInt(info.yaw)); }); }else { if(document.all){ var flashPlayerLink = map23DConfig.map23DAssetsUrl+"/soft/flashplayer_winax.exe"; }else { var flashPlayerLink = map23DConfig.map23DAssetsUrl+"/soft/flashplayer_win.exe"; } var installFlashHtml = '
' + '

请安装Adobe flash player 11以上版本的播放器。

' + 'Adobe Flash Player 11' + '
'; document.getElementById('leadorStreetViewSwf').innerHTML = installFlashHtml; } }, /** * 图标 添加 * @private */ _addViewMarker: function () { var _this = this; _this._viewMarkerBox = L.DomUtil.create('div','leador-street-view-marker-box'); //创建标志 var latlng = new L.latLng(39.91302,116.4166) latlng = L.Util.formatHMS(latlng) var options_popup = { name:'请把我拖动到蓝色路网上!', content:'

'+latlng.lng+';'+latlng.lat+'

' } var popupHtml = _this._creatPopupHtml(options_popup); _this._viewMarker = L.marker([39.91302,116.4166],{ draggable:true, icon: L.divIcon({ className:'leador-street-view-marker', iconSize: [89, 68], iconAnchor: [43, 38], popupAnchor: [-2, -35], html:'
' }) }).bindPopup(popupHtml).addTo(map2DViewer.groups[_this._groupId]).openPopup(); //创建3D标记 var center = map23DData.view.center; _this.streetMarkerGuid = map3DViewer.marker({ action:'add', groupId:_this._groupId, geojson:{ "properties": { title:'请点击蓝色网路', iconUrl: map23DConfig.map23DAssetsUrl+'/images/layout/icon-shijing4.png', altitude:0, altitudeMode:0, iconSize: [25, 25], iconAnchor: [12, 12], popupAnchor:[0,-14], popupContent:'请点击蓝色网路' }, "geometry": { "coordinates": [center.lng,center.lat] } } }) _this._showStreet3DView(); _this._viewMarker.on('dragend',function(){ _this._showStreet3DView(); }); }, _updateViewMarker:function(angle){ var mod=Math.floor(angle/30); var index=0; if(angle>(mod*30-15) && angle< (mod*30+15)){ //index=mod*30; index=mod; }else if(angle>((mod+1)*30-15) && angle< ((mod+1)*30+15)){ index=mod+1; } if(index==12){ index=0; } var viewMarkerBox = document.getElementById("leadorStreetViewMarkerBox"); viewMarkerBox.style.backgroundPosition = '0px -'+(index*68)+'px'; }, /** * 添加路网瓦片 * @private */ _addViewRoadTile:function(){ var _this = this; /*_this.tileLayerOverAddress = new L.TileLayer(onemapUrlConfig.leadorStreetTileUrl, { minZoom: 1, maxZoom: 19, zIndex: 11 }); _this.tileLayerOverAddress.addTo(_this._map);*/ _this.streetLayerGuid=map23DControl.tileLayer({ action: 'add', layer: { url2D: onemapUrlConfig.leadorStreetTileUrl + '?l={z}&x={x}&y={y}', url3D: onemapUrlConfig.leadorStreetTileUrl + '?z=%d&x=%d&y=%d', minZoom: 1, maxZoom: 19, maxNativeZoom: 8, attribution: '', opacity: 1, imageType: 'png' } }) }, updateMarker23D:function(option,center){ var _this = this; if(option === '2d'){ if(_this._viewMarker){ _this._viewMarker.setLatLng([center.y,center.x]); _this._showStreet3DView(); } }else if(option === '3d'){ if(_this._viewMarker){ var latlng = _this._viewMarker.getLatLng(); map3DViewer.marker({ action: 'update', guid:_this.streetMarkerGuid, geojson: { "geometry": { "coordinates": [latlng.lng, latlng.lat] } } }) } } }, updateMarker3D:function(options){ var _this = this; if(_this.streetMarkerGuid){ map3DViewer.marker({ action: 'update', guid:_this.streetMarkerGuid, geojson: { "geometry": { "coordinates": [options.x, options.y] } } }) _this.updateMarker23D('2d',options) } }, controlMyLayer:function(options){ var _this = this; if(options == 'show'){ map23DControl.tileLayer({ action:'show', guid:_this.streetLayerGuid }) }else if(options =='hide'){ map23DControl.tileLayer({ action:'hide', guid:_this.streetLayerGuid }) } }, /** * 移除路网瓦片 * @private */ _removeViewRoadTile:function(){ var _this = this; //_this._map.removeLayer(_this.tileLayerOverAddress); map23DControl.tileLayer({ action: 'remove', guid: _this.streetLayerGuid }) _this.streetLayerGuid = null; }, /** * 标志 移除 * @private */ _removeViewMarker: function () { var _this = this; map23DControl.group({ action:'remove', guid:_this._groupId }) _this._viewModal.style.left = '-10000px'; /*map3DViewer.marker({ action:'remove', guid:_this.streetMarkerGuid })*/ _this.streetMarkerGuid = null; _this._isShow = false; LeadorStreetView.removeBinding(); swfobject.removeSWF(document.getElementById('leadorStreetViewWrap').id); setTimeout(function(){ document.getElementById('leadorStreetViewModal').innerHTML = _this._vieModalHtml; }, 300); }, /** * 显示3d实景 * @private */ _showStreet3DView:function(){ var _this = this; _this._viewLatlng = _this._viewMarker.getLatLng(); if(!_this._isShow){ _this._viewModal.style.left = '60px'; _this._isShow = true; } LeadorStreetView.loadStreetViewByPosition(_this._viewLatlng.lng,_this._viewLatlng.lat); } }); L.control.leadorStreetView = function(options){ return new L.Control.LeadorStreetView(options); };