geoserver+openlayers4
<html lang=”en”>
<head>
<link rel=”stylesheet” href=”https://openlayers.org/en/v4.0.1/css/ol.css” type=”text/css”>
<style>
.map {
height: 630px;
width: 1360px;
}
</style>
<script src=”https://openlayers.org/en/v4.0.1/build/ol.js” type=”text/javascript”></script>
<title>OpenLayers example</title>
</head>
<body style=”width:100%;height=100%;margin:0px”>
<div id=”map” class=”map”></div>
<script type=”text/javascript”>
// 发布geoverser BBOX 值得范围，分别代表图层的minx,miny,maxx,maxy
var extent=[73.5577011108401,18.1593055725098,134.77392578125,53.5608596801759];
var map = new ol.Map({
target: ‘map’,
layers: [
new ol.layer.Image({
source: new ol.source.ImageWMS({
url: ‘http://localhost:8088/geoserver/CHINA/wms’,
params: {‘LAYERS’: ‘CHINA:chn_adm1′,’SRS’:’EPSG:4326′,’VERSION’:’1.1.0′,’WIDTH’:’1360px’, ‘HEIGHT’:’630px’,’BBOX’:extent },
serverType: ‘geoserver’
})
})
],
view: new ol.View({
//center: 自己指定
center: [100,35],
zoom: 2,
projection:new ol.proj.Projection({
code: ‘EPSG:4326’,
units:’degrees’,
extent:extent //扩展渲染
})
})
});
</script>
</body>
</html>
转载自：https://blog.csdn.net/u011262117/article/details/64122217
