OpenLayers加载Google地图
原先发在了OpenLayers中文网,交流的人很少，所有又发到这里。
之前看了一些继承自TileCache的实现,这里也发一下自己的实现,继承自XYZ类。接触OpenLayers时间不长,没有实际项目应用经验,有理解不清的地方还望各位多多指教,谢谢！
/* Copyright (c) 2002-2012 by fiftyk*//** * @requires OpenLayers/Layer/XYZ.js *//** * @class */OpenLayers.Layer.GMapLayer = OpenLayers.Class(OpenLayers.Layer.XYZ, { wrapDateLine:true, sphericalMercator:true, urlTpl:"&hl=zh-CN&gl=CN&src=app&x=${x}&y=${y}&z=${z}", /** * @constructor * @param {String} name * @param {String} url * @param {Object} options */ initialize:function(name,url,options){ options = OpenLayers.Util.applyDefaults({}, options); OpenLayers.Layer.XYZ.prototype.initialize.apply(this, [name,url,options]); }, getURL: function (bounds) { var xyz = this.getXYZ(bounds); var url = this.url; if (OpenLayers.Util.isArray(url)) { var s = '' + xyz.x + xyz.y + xyz.z; url = this.selectUrl(s, url) + this.urlTpl; } return OpenLayers.String.format(url, xyz); }, destory:function(){ this.sphericalMercator = null; this.urlTpl = null; OpenLayers.Layer.XYZ.prototype.destroy.apply(this, arguments); }, clone:function(obj){ if(obj == null){ obj = new OpenLayers.Layer.GMapLayer(this.name,this.url, this.getOptions()); } obj = OpenLayers.Layer.XYZ.prototype.clone.apply(this,[obj]); return obj; }, getXYZ:function(bounds){ var res = this.getServerResolution(); var x = Math.round((bounds.left - this.maxExtent.left) / (res * this.tileSize.w)); var y = Math.round((this.maxExtent.top - bounds.top) / (res * this.tileSize.h)); var z = this.getServerZoom();//继承自Grid if (this.wrapDateLine) { var limit = Math.pow(2, z); x = ((x % limit) + limit) % limit; } return {'x': x, 'y': y, 'z': z}; }, CLASS_NAME: "OpenLayers.Layer.GMapLayer"});?使用:
var map = new OpenLayers.Map("map",{ layers:[ new OpenLayers.Layer.GMapLayer("Google卫星图层", ["http://mt1.google.cn/vt/lyrs=s@123"]), new OpenLayers.Layer.GMapLayer("Google标注图层", ["http://mt2.google.cn/vt/imgtp=png32&lyrs=h@205000000"]), new OpenLayers.Layer.GMapLayer("Google矢量图层", ["http://mt1.google.cn/vt/lyrs=m@205000000"]), new OpenLayers.Layer.GMapLayer("Google地形图层", ["http://mt1.google.cn/vt/lyrs=t@130,r@205000000"]), new OpenLayers.Layer.GMapLayer("Google路况图层", ["http://mt0.google.com/vt?lyrs=m@205000000,traffic|seconds_into_week:-1"]) ] ,center:new OpenLayers.LonLat(120.30549379552448,31.55342767838905), }); //图层切换控件 map.addControl(new OpenLayers.Control.LayerSwitcher()); //鹰眼控件 map.addControl(new OpenLayers.Control.OverviewMap());?