Simplify custom circle rendering

examples/custom-circle-render.js

@@ -11,10 +11,10 @@ const circleFeature = new Feature({
 });
 circleFeature.setStyle(
   new Style({
-    renderer(coordinate, state) {
+    renderer(coordinates, state) {
       // eslint-disable-next-line no-console
       console.log('This circle is rendered by the code below.', Date.now());
-      const [x, y, x1, y1] = coordinate;
+      const [[x, y], [x1, y1]] = coordinates;
       const ctx = state.context;
       const dx = x1 - x;
       const dy = y1 - y;

src/ol/render/canvas/Builder.js

@@ -303,7 +303,10 @@ class CanvasBuilder extends VectorContext {
         renderer,
         inflateCoordinatesArray,
       ]);
-    } else if (type == GeometryType.LINE_STRING) {
+    } else if (
+      type == GeometryType.LINE_STRING ||
+      type == GeometryType.CIRCLE
+    ) {
       flatCoordinates = geometry.getFlatCoordinates();
       builderEnd = this.appendFlatLineCoordinates(
         flatCoordinates,
@@ -345,26 +348,6 @@ class CanvasBuilder extends VectorContext {
         geometry,
         renderer,
       ]);
-    } else if (type == GeometryType.CIRCLE) {
-      const flatCoordinates = geometry.getFlatCoordinates();
-      this.appendFlatLineCoordinates(
-        flatCoordinates,
-        0,
-        flatCoordinates.length,
-        stride,
-        false,
-        false
-      );
-      builderEnd = this.coordinates.length;
-      this.instructions.push([
-        CanvasInstruction.CUSTOM,
-        builderBegin,
-        builderEnd,
-        geometry,
-        renderer,
-        undefined,
-        4,
-      ]);
     }
     this.endGeometry(feature);
   }

src/ol/render/canvas/Executor.js

@@ -731,7 +731,6 @@ class Executor {
           const geometry = /** @type {import("../../geom/SimpleGeometry.js").default} */ (instruction[3]);
           const renderer = instruction[4];
           const fn = instruction.length == 6 ? instruction[5] : undefined;
-          const coordsLength = instruction.length >= 7 ? instruction[6] : 2;
           state.geometry = geometry;
           state.feature = feature;
           if (!(i in coordinateCache)) {
@@ -741,10 +740,9 @@ class Executor {
           if (fn) {
             fn(pixelCoordinates, d, dd, 2, coords);
           } else {
-            for (let index = 0; index < coordsLength; index++) {
+            coords[0] = pixelCoordinates[d];
-              coords[index] = pixelCoordinates[d + index];
+            coords[1] = pixelCoordinates[d + 1];
-            }
+            coords.length = 2;
-            coords.length = coordsLength;
           }
           renderer(coords, state);
           ++i;