use anchor for offsetting

rendering/cases/regularshape-style/main.js

@@ -13,16 +13,17 @@ const vectorSource = new VectorSource();
 function createFeatures(stroke, fill, offSet = [0, 0]) {
   let feature;
   feature = new Feature({
-    geometry: new Point([-15 + offSet[0], 15 + offSet[1]])
+    geometry: new Point([offSet[0], offSet[1]])
   });
-  // square
+  // square with offset
   feature.setStyle(new Style({
     image: new RegularShape({
       fill: fill,
       stroke: stroke,
       points: 4,
       radius: 10,
-      angle: Math.PI / 4
+      angle: Math.PI / 4,
+      offset: [-15, 15]
     })
   }));
   vectorSource.addFeature(feature);

src/ol/style/RegularShape.js

@@ -371,11 +371,11 @@ class RegularShape extends ImageStyle {
     size = this.canvas_.width;
     const imageSize = size;
 
-    this.draw_(renderOptions, context, this.offset_[0], this.offset_[1]);
+    this.draw_(renderOptions, context, 0, 0);
 
     this.createHitDetectionCanvas_(renderOptions);
 
-    this.anchor_ = [size / 2, size / 2];
+    this.anchor_ = [size / 2 - this.offset_[0], size / 2 + this.offset_[1]];
     this.size_ = [size, size];
     this.imageSize_ = [imageSize, imageSize];
   }