时下的OpenLayers版本为v2.10，不仅可以支持OGC的标准服务如WMS、WFS等，还支持其它地图服务商如GoogleMaps，VirtualEarth，YahooMaps等，如下为OpenLayers v2.10中进行的多底图示例代码：
- <html>
- <head>
- <title>OpenLayers多方底图示例</title>
- <META charset="utf-8">
- <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
- <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
- <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3" type="text/javascript"></script>
- <script src="http://api.maps.yahoo.com/ajaxymap?v=3.0&appid=euzuro-openlayers" type="text/javascript"></script>
- <script type=text/javascript>
- (function(){
- var map;
- var wms, google, ve, yahoo;
- var lon = 105.9960, lat = 36.8701, zoom = 3;
- window.init=function(){
- map = new OpenLayers.Map('divMap');
- wms = new OpenLayers.Layer.WMS("OpenLayers WMS",
- "http://labs.metacarta.com/wms/vmap0",
- {layers: 'basic'});
- google = new OpenLayers.Layer.Google("Google");
- ve = new OpenLayers.Layer.VirtualEarth("Virtual Earth");
- yahoo = new OpenLayers.Layer.Yahoo("Yahoo");
- map.addLayers([wms, google, ve, yahoo]);
- map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
- map.addControl(new OpenLayers.Control.LayerSwitcher());
- map.addControl(new OpenLayers.Control.MousePosition());
- };
- })();
- </script>
- </head>
- <body onload="init()">
- <div id="divMap" style="height: 400px; width:600px; border:solid 1px gray"></div>
- </body>
- </html>
1.OpenLayers WMS做底图
2.GoogleMaps做底图
3.VirtualEarth做底图
4.YahooMaps做底图
P.S. 通过OpenLayers进行各图商的整合非常方便和快速，从而实现地理信息的集成与共享。
本文转自 彭金华 51CTO博客，原文链接:http://blog.51cto.com/pengjh/624102
