四章-45-WKT

2020-04-07 本文已影响0人彩云飘过

本文基于腾讯课堂老胡的课《跟我学Openlayers--基础实例详解》做的学习笔记，使用的openlayers 5.3.x api。

源码见 1045.html ，对应的官网示例 https://openlayers.org/en/latest/examples/wkt.html?q=wkt

image.png

<!DOCTYPE html>
<html>

<head>
 <title>WKT</title>
 <link rel="stylesheet" href="../include/ol.css" type="text/css" />
 <script src="../include/ol.js"></script>
</head>

<body>

 <div id="map" class="map"></div>

 <script>
   var raster = new ol.layer.Tile({
     source: new ol.source.OSM()
   });

   var wkt = 'POLYGON((10.689 -25.092, 34.595 ' +
     '-20.170, 38.814 -35.639, 13.502 ' +
     '-39.155, 10.689 -25.092))';

   var format = new ol.format.WKT();

   var feature = format.readFeature(wkt, {
     dataProjection: 'EPSG:4326',
     featureProjection: 'EPSG:3857'
   });

   var vector = new ol.layer.Vector({
     source: new ol.source.Vector({
       features: [feature]
     })
   });

   var map = new ol.Map({
     layers: [raster, vector],
     target: 'map',
     view: new ol.View({
       center: [2952104.0199, -3277504.823],
       zoom: 4
     })
   });

 </script>
</body>

</html>

四章-45-WKT

猜你喜欢

热点阅读