首页使用openlayers实现两点之间连接线段

使用openlayers实现两点之间连接线段

时间: 2024-05-05 18:15:02 浏览: 108

以下是使用OpenLayers实现两点之间连接线段的示例代码： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>OpenLayers Example</title> <style> #map { width: 100%; height: 500px; } </style> <link rel="stylesheet" href="https://openlayers.org/en/v6.5.0/css/ol.css" type="text/css"> <script src="https://openlayers.org/en/v6.5.0/build/ol.js"></script> </head> <body> <div id="map" class="map"></div> <script type="text/javascript"> var map = new ol.Map({ target: 'map', view: new ol.View({ center: ol.proj.fromLonLat([0, 0]), zoom: 2 }) }); var startPoint = ol.proj.fromLonLat([0, 0]); var endPoint = ol.proj.fromLonLat([30, 60]); var line = new ol.geom.LineString([startPoint, endPoint]); var feature = new ol.Feature({ geometry: line, name: 'Line', style: new ol.style.Style({ stroke: new ol.style.Stroke({ color: 'red', width: 2 }) }) }); var vectorSource = new ol.source.Vector({ features: [feature] }); var vectorLayer = new ol.layer.Vector({ source: vectorSource }); map.addLayer(vectorLayer); </script> </body> </html> ``` 该代码将在地图上绘制一条连接起始点和终止点的红色线段。您可以在代码中更改 "startPoint" 和 "endPoint" 变量的值，以更改线段的起始点和终止点。

阅读全文