OpenLayer加载geoserver，OSM，ARCGIS发布地图服务
说明：发布的地图服务地址可以在geoserver图层OpenLayer预览地址栏中拿到；
arcgis服务地址可以在arcgis server manager中拿到；
地图投影为wgs84；
实现代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>放大缩小</title>
<link href="../css/ol.css">
<script src="../js/ol,js.js"></script>
<script src="../js/jquery-1.3.1.js"></script>
</head>
<body>
<div id="map" style="height: 100%;">
</div>
<script>
$(function () {
var geoserverlayer=new ol.layer.Tile({
visible: true,
source: new ol.source.TileWMS({
url: 'http://localhost:8087/geoserver/ceshi/wms', //geoserver图层地图
params: {'FORMAT': 'image/png',
'VERSION': '1.1.1',
tiled: true,
STYLES: '',
LAYERS: 'ceshi:demo', //图层名
}
})
});
var osmlayer=new ol.layer.Tile({
source:new ol.source.OSM()
});
var arcgisLayer=new ol.layer.Tile({
source:new ol.source.TileArcGISRest({
url:'http://localhost:6080/arcgis/rest/services/itmsdp/MapServer'
})
})
var projection = new ol.proj.Projection({
code: 'EPSG:4326',
units: 'degrees',
axisOrientation:'neu'
});
var map = new ol.Map({
controls: ol.control.defaults().extend([
new ol.control.MousePosition({
className:"ol-mouseposition",
coordinateFormat: ol.coordinate.createStringXY(5)
})
]),
target: 'map',
layers: [
osmlayer,geoserverlayer,arcgisLayer
],
view: new ol.View({
projection: projection,
center: [129.631215,44.590727], // 定义地图显示中心于经度0度，纬度0度处
zoom: 9 // 并且定义地图显示层级为2
})
});
})
</script>
</body>
</html>转载自：https://blog.csdn.net/wo_buzhidao/article/details/79151596
