电子海图开发第十九篇 web电子海图使用OpenLayers加载瓦片地图（共一百篇）

阅读：评论：0

构建OpenLayers，首先在在要web电子海图的网页中引入ol.js和ol.css这两个文件，你可以到openlayers官网去下载这个文件，也可以到，并且可以查看演示的效果。

map的创建完整代码

<!doctype html>
<html lang="en"><head><link rel="stylesheet" href="js/ol/ol.css" type="text/css">< src="js/ol4.6.5.js"></><title>OpenLayers example</title></head>
<style>.map {height: 100%;width: 100%;}</style><body><h2>My Map</h2><div id="map" class="map"></div><script>
var seamap = new ol.layer.Tile({source : new ol.source.XYZ({url : "112.126.96.159/Ship/Map?z={z}&y={y}&x={x}",projection : 'EPSG:3857'})
});zoomslider = l.ZoomSlider(); zoomcontrol = l.Zoom(); 
map = new ol.Map({layers : [ seamap ],view : new ol.View({center : ansform([ 119.22, 39.222 ], 'EPSG:4326','EPSG:3857'),projection : 'EPSG:3857',zoom : 5,minZoom : 2,maxZoom : 15,}),target : 'map',controls : [ zoomslider, zoomcontrol ]});
</script> </body> </html>