使用OpenLayers疊加天地圖
阿新 • • 發佈:2019-02-06
var olMap = { mapCenter:null, changeBaseLayer : function() { $(".changeBaseLayer").bind('click',function(e){ var lyrName = '天地圖向量'; var lyrVec = olMap.map.getLayersByName(lyrName); lyrName = '天地圖影像'; var lyrImg = olMap.map.getLayersByName(lyrName); if(olMap.map.baseLayer == lyrVec[0]){ $(".changeBaseLayer").css("background-image", "url(img/vec.png)"); olMap.map.setBaseLayer(lyrImg[0]); }else{ $(".changeBaseLayer").css("background-image", "url(img/img.png)"); olMap.map.setBaseLayer(lyrVec[0]); } }); }, map : null, initMap : function() { olMap.mapCenter = new OpenLayers.LonLat(11536516.407524, 4312888.4378666); if(system.area === '城關區'){ olMap.mapCenter = new OpenLayers.LonLat(11562947.655498, 4314389.2151457); } if(system.area === '安寧區'){ olMap.mapCenter = new OpenLayers.LonLat(11547727.132247, 4317733.3351327); } if(system.area === '七里河區'){ olMap.mapCenter = new OpenLayers.LonLat(11554396.365796, 4293990.557878); } var options = { controls : [], featureEvents: true, projection : "EPSG:900913", center : olMap.mapCenter }; olMap.map = new OpenLayers.Map("map", options); olMap.addTdtLayer(); olMap.addControl(); var format = 'image/png'; var xgqBoundsLayer = new OpenLayers.Layer.WMS( "xgq:"+ system.area, geoserverUrlWMS, { STYLES: '', LAYERS: 'xgq:'+system.area, format: format, transparent:true }, { buffer: 0, displayOutsideMaxExtent: true, isBaseLayer: false, yx : {'EPSG:4326' : true} } ); olMap.map.addLayers([xgqBoundsLayer]); }, addControl : function() { var overMapOption = { projection : "EPSG:900913" }; olMap.map.addControl(new OpenLayers.Control.OverviewMap(overMapOption)); olMap.map.addControl(new OpenLayers.Control.PanZoom()); olMap.map.addControl(new OpenLayers.Control.Navigation()); }, addTdtLayer : function() { var tdtLayerVec = new OpenLayers.Layer.XYZ( "天地圖向量", [ "http://t0.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}", "http://t1.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}", "http://t2.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}", "http://t3.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}", "http://t4.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}", "http://t5.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}", "http://t6.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}", "http://t7.tianditu.com/DataServer?T=vec_w&X=${x}&Y=${y}&L=${z}" ], { isBaseLayer : true, visibility : true, sphericalMercator : true }); var tdtLayerImg = new OpenLayers.Layer.XYZ( "天地圖影像", [ "http://t0.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}", "http://t1.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}", "http://t2.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}", "http://t3.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}", "http://t4.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}", "http://t5.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}", "http://t6.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}", "http://t7.tianditu.com/DataServer?T=img_w&X=${x}&Y=${y}&L=${z}" ], { isBaseLayer : true, visibility : true, sphericalMercator : true }); var tdtLayerCva = new OpenLayers.Layer.XYZ( "天地圖標註", [ "http://t0.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}", "http://t1.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}", "http://t2.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}", "http://t3.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}", "http://t4.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}", "http://t5.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}", "http://t6.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}", "http://t7.tianditu.com/DataServer?T=cva_w&X=${x}&Y=${y}&L=${z}" ], { isBaseLayer : false, visibility : true }); olMap.map.addLayer(tdtLayerVec); olMap.map.addLayer(tdtLayerImg); olMap.map.addLayer(tdtLayerCva); olMap.map.zoomToScale(200000, true); /*licKeys=['西','固','區']; var validateLicenseStr = 'if( lic' +'ense' +'' + '!==' + 'docum'+'ent.ti' +'tle||docu' +'ment.title.' +'index' +'Of(lic' +'Keys.join("")) === -1){do' +'cume' +'nt.ti' +'tle=def' +'aultTi' +'tle;$(".he' +'ader' +'Div h' +'2").ht' +'ml(def' +'ault' +'Title);}'; eval(validateLicenseStr);*/ } }