Added test + jsdoc

src/ol/style/Icon.js

@@ -33,7 +33,7 @@ import ImageStyle from './Image.js';
  * to provide the size of the image, with the `imgSize` option.
  * @property {Array<number>} [offset=[0, 0]] Offset, which, together with the size and the offset origin, define the
  * sub-rectangle to use from the original icon image.
- * @property {Array<number>} [displacement=[0,0]] Displacement the icon from the center
+ * @property {Array<number>} [displacement=[0,0]] Displacement the icon
  * @property {import("./IconOrigin.js").default} [offsetOrigin='top-left'] Origin of the offset: `bottom-left`, `bottom-right`,
  * `top-left` or `top-right`.
  * @property {number} [opacity=1] Opacity of the icon.

src/ol/style/RegularShape.js

@@ -20,7 +20,7 @@ import ImageStyle from './Image.js';
  * @property {number} [radius1] Outer radius of a star.
  * @property {number} [radius2] Inner 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]] Offset of the shape
+ * @property {Array<number>} [displacement=[0,0]] Displacement of the shape
  * @property {import("./Stroke.js").default} [stroke] Stroke style.
  * @property {number} [rotation=0] Rotation in radians (positive rotation clockwise).
  * @property {boolean} [rotateWithView=false] Whether to rotate the shape with the view.

test/spec/ol/style/icon.test.js

@@ -97,22 +97,26 @@ describe('ol.style.Icon', function() {
         color: [1, 2, 3, 0.4],
         src: src,
         offset: [1, 2],
-        size: [10, 12]
+        size: [10, 12],
+        displacement: [5, 6]
       });
       const clone = original.clone();
       expect(original.getAnchor()).not.to.be(clone.getAnchor());
       expect(original.offset_).not.to.be(clone.offset_);
       expect(original.getColor()).not.to.be(clone.getColor());
       expect(original.getSize()).not.to.be(clone.getSize());
+      expect(original.getDisplacement()).not.to.be(clone.getDisplacement());
 
       clone.anchor_[0] = 0;
       clone.offset_[0] = 0;
       clone.color_[0] = 0;
       clone.size_[0] = 5;
+      clone.displacement_[0] = 10;
       expect(original.anchor_).not.to.eql(clone.anchor_);
       expect(original.offset_).not.to.eql(clone.offset_);
       expect(original.color_).not.to.eql(clone.color_);
       expect(original.size_).not.to.eql(clone.size_);
+      expect(original.displacement_).not.to.eql(clone.displacement_);
     });
   });
 
@@ -229,6 +233,18 @@ describe('ol.style.Icon', function() {
       iconStyle.iconImage_.size_ = imageSize;
       expect(iconStyle.getOrigin()).to.eql([92, 20]);
     });
+
+    it('uses a top right offset origin + displacement', function() {
+      const iconStyle = new Icon({
+        src: 'test.png',
+        size: size,
+        offset: offset,
+        offsetOrigin: 'top-right',
+        displacement: [20, 10]
+      });
+      iconStyle.iconImage_.size_ = imageSize;
+      expect(iconStyle.getOrigin()).to.eql([92 + 20, 20 + 10]);
+    });
   });
 
   describe('#getImageSize', function() {