openlayers不能画星星

Openlayers can't draw the star

我有一组选项可以绘制,尽管所有工作都有效(因为它们属于一个代码)我无法绘制星号,这是从另一个解决方案中合并的。

我从这里捡到的:

https://openlayers.org/en/latest/examples/draw-shapes.html

接下来按照这些方法对其进行了修改:

https://github.com/openlayers/openlayers/issues/8512

https://dolmenweb.it/viewers/openlayer/examples/draw-shapes.html

现在我的代码如下所示:

var starInteraction = new ol.interaction.Draw({
 source: vectorLayer.getSource(),
 type: 'Polygon',
 geometryFunction: function (coordinates, geometry) {
 if (!geometry) {
  geometry = new ol.geom.Polygon([newCoordinates]);
 } else {
  geometry.setCoordinates([newCoordinates]);
 }
 var center = coordinates[0];
          var last = coordinates[1];
          var dx = center[0] - last[0];
          var dy = center[1] - last[1];
          var radius = Math.sqrt(dx * dx + dy * dy);
          var rotation = Math.atan2(dy, dx);
          var newCoordinates = [];
          var numPoints = 12;
          for (var i = 0; i < numPoints; ++i) {
            var angle = rotation + i * 2 * Math.PI / numPoints;
            var fraction = i % 2 === 0 ? 1 : 0.5;
            var offsetX = radius * fraction * Math.cos(angle);
            var offsetY = radius * fraction * Math.sin(angle);
            newCoordinates.push([center[0] + offsetX, center[1] + offsetY]);
          }
          newCoordinates.push(newCoordinates[0].slice());
          geometry.setCoordinates([newCoordinates]);
          return geometry;
        }
    }); 
    starInteraction.setActive(false);
    starInteraction.on('drawend', onDrawend);

不幸的是,我收到一个错误:

未捕获类型错误:无法读取未定义的属性

主要是指这行代码:

   if (coordinates.length === 0) {

存在于另一个文件中。 那么这里可能缺少什么? 我的完整 fiddle 看起来像这样:

https://jsfiddle.net/Lb0xu8fe/

调用

时你没有定义newCoordinates
 if (!geometry) {
  geometry = new ol.geom.Polygon([newCoordinates]);
 } 

将该行更改为

 if (!geometry) {
  geometry = new ol.geom.Polygon([]);
 }

所以你有一个空数组而不是一个包含未定义条目的数组

或者,您可以像最近的示例那样将行向下移动 https://openlayers.org/en/latest/examples/draw-shapes.html

 if (!geometry) {
  geometry = new ol.geom.Polygon([newCoordinates]);
 } else {
   geometry.setCoordinates([newCoordinates]);
 }