Consistent behaviour if two radii are provided

Always double the points event when two radii of same size are provided.

src/ol/style/RegularShape.js

@@ -23,8 +23,8 @@ import {
  * @property {number} points Number of points for stars and regular polygons. In case of a polygon, the number of points
  * is the number of sides.
  * @property {number} [radius] Radius of a regular polygon.
- * @property {number} [radius1] Outer radius of a star.
- * @property {number} [radius2] Inner radius of a star.
+ * @property {number} [radius1] First radius of a star. Ignored if radius is set.
+ * @property {number} [radius2] Second radius of a star.
  * @property {number} [angle=0] Shape's angle in radians. A value of 0 will have one of the shape's point facing up.
  * @property {Array<number>} [displacement=[0,0]] Displacement of the shape
  * @property {import("./Stroke.js").default} [stroke] Stroke style.
@@ -378,7 +378,8 @@ class RegularShape extends ImageStyle {
       }
     }
 
-    const size = 2 * (this.radius_ + strokeWidth) + 1;
+    const maxRadius = Math.max(this.radius_, this.radius2_ || 0);
+    const size = 2 * (maxRadius + strokeWidth) + 1;
 
     return {
       strokeStyle: strokeStyle,
@@ -501,8 +502,8 @@ class RegularShape extends ImageStyle {
     if (points === Infinity) {
       context.arc(0, 0, radius, 0, 2 * Math.PI);
     } else {
-      const radius2 = this.radius2_ !== undefined ? this.radius2_ : radius;
-      if (radius2 !== radius) {
+      const radius2 = this.radius2_ === undefined ? radius : this.radius2_;
+      if (this.radius2_ !== undefined) {
         points *= 2;
       }
       const startAngle = this.angle_ - Math.PI / 2;

test/browser/spec/ol/style/regularshape.test.js

@@ -91,6 +91,18 @@ describe('ol.style.RegularShape', function () {
       expect(style.getDisplacement()[0]).to.eql(0);
       expect(style.getDisplacement()[1]).to.eql(0);
     });
+    it('will use the larger radius to calculate the size', function () {
+      let style = new RegularShape({
+        radius: 10,
+        radius2: 5,
+      });
+      expect(style.getSize()).to.eql([20, 20]);
+      style = new RegularShape({
+        radius: 5,
+        radius2: 10,
+      });
+      expect(style.getSize()).to.eql([20, 20]);
+    });
 
     it('can use offset', function () {
       const style = new RegularShape({
@@ -173,4 +185,47 @@ describe('ol.style.RegularShape', function () {
       );
     });
   });
+
+  describe('#createPath_', function () {
+    let canvas;
+    beforeEach(function () {
+      canvas = {
+        arc: sinon.spy(),
+        lineTo: sinon.spy(),
+        closePath: sinon.spy(),
+      };
+    });
+    it('does not double the points without radius2', function () {
+      const style = new RegularShape({
+        radius: 10,
+        points: 4,
+      });
+      style.createPath_(canvas);
+      expect(canvas.arc.callCount).to.be(0);
+      expect(canvas.lineTo.callCount).to.be(4);
+      expect(canvas.closePath.callCount).to.be(1);
+    });
+    it('doubles the points with radius2', function () {
+      const style = new RegularShape({
+        radius: 10,
+        radius2: 12,
+        points: 4,
+      });
+      style.createPath_(canvas);
+      expect(canvas.arc.callCount).to.be(0);
+      expect(canvas.lineTo.callCount).to.be(8);
+      expect(canvas.closePath.callCount).to.be(1);
+    });
+    it('doubles the points when radius2 equals radius', function () {
+      const style = new RegularShape({
+        radius: 10,
+        radius2: 10,
+        points: 4,
+      });
+      style.createPath_(canvas);
+      expect(canvas.arc.callCount).to.be(0);
+      expect(canvas.lineTo.callCount).to.be(8);
+      expect(canvas.closePath.callCount).to.be(1);
+    });
+  });
 });