OpenLayers 加载静态图片
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="../scripts/ol.css" type="text/css" />
<style>
.map {
height: 98%;
width: 100%;
}
</style>
<script src="../scripts/ol.js" type="text/javascript"></script>
<title>OpenLayers example</title>
</head>
<body>
<div id="map" class="map"></div>
<script type="text/javascript">
var extent = [0, 0, 418, 600];
var projection = new ol.proj.Projection({
code: 'xkcd-image',
units: 'pixels',
extent: extent
});
var map = new ol.Map({
layers: [
new ol.layer.Image({
source: new ol.source.ImageStatic({
url: 'http://localhost:2265/images2/test1.png',//这里添加静态图片的地址
projection: projection,
imageExtent: extent
})
})
],
target: 'map',
view: new ol.View({
projection: projection,
center: ol.extent.getCenter(extent),
zoom: 2,
maxZoom: 8
})
});
</script>
</body>
</html>该例子亲测正确。
转载自：https://blog.csdn.net/h1534589653/article/details/77572444
