OpenLayers 加载静态图片

来源：互联网发布：怎么自己开淘宝网店编辑：程序博客网时间：2024/06/01 23:02

<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>

该例子亲测正确。

阅读全文

0 0