您的位置：首页 > 其它

[epoch]OL3调用WMS服务展示地图，服务由epoch发布

2015-08-14 09:27 441 查看 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
#map{
height: 310px;
width: 512px;
}
</style>
<title>EPOCH WMS测试</title>
<script src="jq/jquery-1.10.2.js" type="text/javascript"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.7.0/ol.css" type="text/css">

<script src="openlayers/ol.js"></script>
</head>
<body>
<div class="container-fluid">

<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
</div>
</div>

</div>
<script type="text/javascript">
var view;
var layers;
layers = [
new ol.layer.Image({
//extent: [73.44696044921875,3.408477306365967,135.08583068847656,53.557926177978516],
source: new ol.source.ImageWMS({
url: 'http://127.0.0.1:8060/gisserver/wmsserver/china',
params: {'LAYERS': ''}
})
})
];
view =  new ol.View({
center: [100, 30],
zoom:20
});
var map = new ol.Map({
layers: layers,
target: 'map',
view:view
});

</script>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航