Question

我已经编写了以下代码来创建LinearRing。但是运行此代码时屏幕上什么都没有出现

 var circleGeom = new ol.geom.Circle(center, 250, 'XY');
 var circleFeature = new ol.Feature();
 var cordPoly = new ol.geom.Polygon.fromCircle(circleGeom);
 var coordinates = cordPoly.getCoordinates();
 var linearRing = new ol.geom.LinearRing(coordinates);
 circleFeature.setGeometry(linearRing);
 vectorlayer.getSource().addfeatures([circleFeature]);

有人可以帮我在这里找到问题吗？

Answer 1

var vectorLayer = new ol.layer.Vector({
  source: new ol.source.Vector(),
  style: new ol.style.Style({
    stroke: new ol.style.Stroke({
      width: 2,
      color: "red"
    })
  })
});

var circleGeom = new ol.geom.Circle([0, 0], 100, 'XY');
vectorLayer.getSource().addFeature(new ol.Feature(ol.geom.Polygon.fromCircle(circleGeom, 10)));

var map = new ol.Map({
  layers: [vectorLayer],
  target: document.getElementById("map"),
  view: new ol.View({
    center: [0, 0],
    zoom: 16
  })
});

html,
body,
#map {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

<link href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" rel="stylesheet"/>
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
<body>
  <div id="map" class="map"></div>
</body>

根据文档，LinearRing不能单独呈现。请尝试：

circleFeature.setGeometry（cordPoly）;

Answer 2

如果要使其表现为圆线，则需要根据相关提示创建 linestring

 var circleGeom = new ol.geom.Circle(center, 250, 'XY');
 var circleFeature = new ol.Feature();
 var cordPoly = ol.geom.Polygon.fromCircle(circleGeom);
 var coordinates = cordPoly.getCoordinates();
 var lineString = new ol.geom.LineString(coordinates[0]);
 circleFeature.setGeometry(lineString);
 vectorlayer.getSource().addfeatures([circleFeature]);

如何在Openlayers中绘制LinearRing

2 个答案: