[英]Displaying a polygon in OpenLayers map
I have a polygon in (longitude, latitude) points I'd like to draw: 我想绘制一个(经度,纬度)点的多边形:
var maxPoint = [36.283, -114.368];
var geoSquare = [ minPoint, [minPoint[0], maxPoint[1]], maxPoint, [maxPoint[0], minPoint[1]]];
var polygonFeature = new Feature(
new Polygon(geoSquare));
I am drawing a map in the following way: 我通过以下方式绘制地图:
var map = new Map({
interactions: defaultInteractions().extend([new Drag()]),
layers: [
new TileLayer({
source: new TileJSON({
url: 'https://maps.siemens.com/styles/osm-bright.json'
})
}),
new VectorLayer({
source: new VectorSource({
features: [polygonFeature]
}),
style: new Style({
stroke: new Stroke({
width: 3,
color: [255, 0, 0, 1]
}),
fill: new Fill({
color: [0, 0, 255, 0.6]
})
})
})
],
target: 'map',
view: new View({
center: [0, 0],
zoom: 2
})
});
This Polygon is near Southern California, but I don't see the square on the map at all. 这个多边形位于南加州附近,但我完全看不到地图上的正方形。 What is wrong??
怎么了??
EDIT 编辑
Feature coordinates must be in LonLat format and must be transformed to the view projection. 特征坐标必须为LonLat格式,并且必须转换为视图投影。 A polygon ring must start and end at the same point and a polygon needs an extra pair of
[]
as they can have addition internal rings (holes). 多边形环必须在同一点开始和结束,并且多边形需要额外的一对
[]
因为它们可以具有附加的内部环(孔)。 Alternative you can create a polygon from an extent. 或者,您可以根据范围创建多边形。 Any of these would work.
这些都可以。
var minPoint = [-121.091, 32.92];
var maxPoint = [-114.368, 36.283];
var geoSquare = [[minPoint, [minPoint[0], maxPoint[1]], maxPoint, [maxPoint[0], minPoint[1]], minPoint]];
var polygonFeature = new Feature(
new Polygon(geoSquare).transform('EPSG:4326','EPSG:3857'));
var minPoint = [-121.091, 32.92];
var maxPoint = [-114.368, 36.283];
var polygonFeature = new Feature(
Polygon.fromExtent(minPoint.concat(maxPoint)).transform('EPSG:4326','EPSG:3857'));
var minPoint = fromLonLat([-121.091, 32.92]);
var maxPoint = fromLonLat([-114.368, 36.283]);
var geoSquare = [[minPoint, [minPoint[0], maxPoint[1]], maxPoint, [maxPoint[0], minPoint[1]], minPoint]];
var polygonFeature = new Feature(
new Polygon(geoSquare));
var minPoint = fromLonLat([-121.091, 32.92]);
var maxPoint = fromLonLat([-114.368, 36.283]);
var polygonFeature = new Feature(
Polygon.fromExtent(minPoint.concat(maxPoint)));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.