OpenLayers-如何从现有lonLat点绘制多边形?

OpenLayers-如何从现有lonLat点绘制多边形?,openlayers,Openlayers,我的数据库中有来自用户定义多边形的经纬度垂直。我的问题是:现在如何在地图上重新创建和显示它们?使用GoogleMapsAPI很容易做到这一点,但我找不到任何关于如何使用OpenLayers实现这一点的文档或示例。有人有过这样做的经验吗 经过大量的实验,我发现了如何做到这一点: let sitePoints=[]; 让siteStyle={ //样式定义 }; 设epsg4326=newopenlayers.Projection(“EPSG:4326”); for(让我输入坐标){ 设coord=

我的数据库中有来自用户定义多边形的经纬度垂直。我的问题是:现在如何在地图上重新创建和显示它们?使用GoogleMapsAPI很容易做到这一点,但我找不到任何关于如何使用OpenLayers实现这一点的文档或示例。有人有过这样做的经验吗

经过大量的实验,我发现了如何做到这一点:

let sitePoints=[];
让siteStyle={
//样式定义
};
设epsg4326=newopenlayers.Projection(“EPSG:4326”);
for(让我输入坐标){
设coord=坐标[i];
让点=新的OpenLayers.Geometry.point(coord.lng,coord.lat);
//从WGS 1984到球形墨卡托的转换
transform(epsg4326,map.getProjectionObject());
地点点。推(点);
}
sitePoints.push(sitePoints[0]);
让linearRing=新的OpenLayers.Geometry.linearRing(站点点);
让geometry=newopenlayers.geometry.Polygon([linearRing]);
让polygonFeature=newOpenLayers.Feature.Vector(几何体、null、siteStyle);
addFeatures([polygonFeature]);
OpenLayers 6 这与OpenLayers 6略有不同,ma花了一段时间才弄明白。所以我在这里粘贴了OL6的相关代码

坐标
的类型为[[[number]]](这是多边形的GeoJson标准)

style
超出范围(如果有人感兴趣,我可以将其粘贴到这里,但每个应用程序都可以对其进行不同的定义)


不确定从那以后更新了多少内容,但这行不是:
site_points.push(site_points[0])对于
LinearRing
,这是不必要的,因为它们会自动关闭自己?能否请您分享一下您是如何实现的。那会有很大帮助。thanksI正在尝试以下
新多边形([[5724580.263018008,2915911.362231543],[5724954.8716375872916119.9031961635],[5724619.8811359412915429.991834908],[5724580.263018008,2915911.362231543])。转换('EPSG:4326','EPSG:3857')
,出于某种原因,它现在仍在绘制中,(奇怪的是,如果我在从draw polygon中获取坐标后绘制它,它就可以工作了,即使它的值相同)你知道吗?
var VectorSource = ol.source.Vector;
var {Tile, Vector} = ol.layer; //import {Tile as TileLayer, Vector as VectorLayer} from 'ol/layer.js';
var TileLayer = Tile;
var VectorLayer = Vector;

var map = new ol.Map(...);

function drawPolygonOnMap(coordinates) {
    const polygonFeature = new ol.Feature(
        new ol.geom.Polygon(coordinates).transform('EPSG:4326','EPSG:3857'));


    let source = new VectorSource({
      features: [polygonFeature]
    });

    var layer = new VectorLayer({
      source: source,
      style: styles
    });

    map.addLayer(layer);
}