1、地图切换方法
注意:父页面访问Iframe页面JS方法需根据Iframe的名字来调用如:named "mapIfame" 即 mapIfame.window.iframeFunction();子页面访问父页面parent.parentFunction();iframeFunction(),parentFunction()都是各自页面的方法。
/* * * IFrame地图与外部操作桥接 * @author BOONYACHENGDU@GMAIL.COM */ (function() { window.MapIframe = {}; MapIframe = { CONSTANT : { /* 支持地图的集合 */ MAPNAMEARRAY : [ "baidu", "googlestreet", "googlesatellite" ], /* IFrame的名字,id与name最好保持一致 */ IFRAMENAME : "mapIframe", /* 当前地图显示的地图类型 */ CURRENT_MAP_NAME : "baidu", LAST_MAP_NAME : "baidu", LAST_MAP_CENTER_LAT:39.915, LAST_MAP_CENTER_LNG:116.404, LAST_MAP_ZOOM:12, CURRENT_MAP_ZOOM:12, CENTER_POINT:null, PARSE_TYPE:2, HAS_TRACK_OBJECT:false }, /** * IFrame内部访问父亲页面的DOM元素 */ getParentElement : function(tagId) { return parent.document.getElementById(tagId); }, /** * 访问IFrame内部页面的DOM元素 */ getIframeElement : function(iframeName,tagId) { return iframeName.window.document.getElementById(tagId); }, /** * 统一地图显示缩放和地图中心位置 */ parseMapCenter:function(){ if( MapIframe.CONSTANT.LAST_MAP_NAME== MapIframe.CONSTANT.CURRENT_MAP_NAME) return ; var latlngs= MapIframe.CONSTANT.LAST_MAP_CENTER_LAT+","+ MapIframe.CONSTANT.LAST_MAP_CENTER_LNG; //地图切换后数据加载处理 if( MapIframe.CONSTANT.LAST_MAP_NAME=="baidu"&& MapIframe.CONSTANT.CURRENT_MAP_NAME=="googlestreet"){ parseLatLng(4,latlngs); }else if( MapIframe.CONSTANT.LAST_MAP_NAME=="baidu"&& MapIframe.CONSTANT.CURRENT_MAP_NAME=="googlesatellite"){ parseLatLng(3,latlngs); }else if( MapIframe.CONSTANT.LAST_MAP_NAME=="googlesatellite"&& MapIframe.CONSTANT.CURRENT_MAP_NAME=="googlestreet"){ parseLatLng(2,latlngs); }else if( MapIframe.CONSTANT.LAST_MAP_NAME=="googlesatellite"&& MapIframe.CONSTANT.CURRENT_MAP_NAME=="baidu"){ parseLatLng(1,latlngs); }else if( MapIframe.CONSTANT.LAST_MAP_NAME=="googlestreet"&& MapIframe.CONSTANT.CURRENT_MAP_NAME=="baidu"){ parseLatLng(6,latlngs); }else if( MapIframe.CONSTANT.LAST_MAP_NAME=="googlestreet"&& MapIframe.CONSTANT.CURRENT_MAP_NAME=="googlesatellite"){ parseLatLng(5,latlngs); } }, /** * IFrame切换地图入口 */ changeMap : function(mapName) { this.CONSTANT.CURRENT_MAP =mapName; this.CONSTANT.CURRENT_MAP_ZOOM=mapIframe.window.map.getZoom(); this.CONSTANT.CENTER_POINT=mapIframe.window.map.getCenter(); if(this.CONSTANT.LAST_MAP_NAME=="baidu"){ this.CONSTANT.LAST_MAP_CENTER_LAT=this.CONSTANT.CENTER_POINT.lat; this.CONSTANT.LAST_MAP_CENTER_LNG=this.CONSTANT.CENTER_POINT.lng; }else{ this.CONSTANT.LAST_MAP_CENTER_LAT=this.CONSTANT.CENTER_POINT.lat(); this.CONSTANT.LAST_MAP_CENTER_LNG=this.CONSTANT.CENTER_POINT.lng(); } var l=window.location; var baseurl = l.protocol + "//" +l.host+"/LBS"; var url=baseurl+"/locate/map/"+mapName; var frame=this.CONSTANT.IFRAMENAME; this.parseMapCenter(); $("#"+frame).attr("src",url); } }; })($);
2、地图切换时地图中心点对应解析
/** * 解析地图中心点经纬度 */ function parseLatLng(type,latlngs){ type=getConvetType(); $.ajax({ url : PROJECT_URL + "/service/"+type+"/" + latlngs+"?maptype="+mapIframe.window.MAP_NAME, dataType : 'json', type : 'GET', async : true, success : function(data) { var result = eval(data); if (result){ MapIframe.CONSTANT.LAST_MAP_CENTER_LAT=result[0].lat; MapIframe.CONSTANT.LAST_MAP_CENTER_LNG=result[0].lng; } } }); }