Offset for ImageStyle

This commit is contained in:
jkonieczny
2019-12-18 08:22:40 +01:00
committed by Andreas Hocevar
parent ee1b038714
commit 4c7f52c8a4
4 changed files with 28 additions and 27 deletions
+5 -2
View File
@@ -10,6 +10,7 @@ import RegularShape from './RegularShape.js';
* @property {import("./Fill.js").default} [fill] Fill style. * @property {import("./Fill.js").default} [fill] Fill style.
* @property {number} radius Circle radius. * @property {number} radius Circle radius.
* @property {import("./Stroke.js").default} [stroke] Stroke style. * @property {import("./Stroke.js").default} [stroke] Stroke style.
* @property {Array<number>} [offset=[0,0]] offset
*/ */
@@ -30,7 +31,8 @@ class CircleStyle extends RegularShape {
points: Infinity, points: Infinity,
fill: options.fill, fill: options.fill,
radius: options.radius, radius: options.radius,
stroke: options.stroke stroke: options.stroke,
offset: options.offset !== undefined ? options.offset : [0, 0]
}); });
} }
@@ -45,7 +47,8 @@ class CircleStyle extends RegularShape {
const style = new CircleStyle({ const style = new CircleStyle({
fill: this.getFill() ? this.getFill().clone() : undefined, fill: this.getFill() ? this.getFill().clone() : undefined,
stroke: this.getStroke() ? this.getStroke().clone() : undefined, stroke: this.getStroke() ? this.getStroke().clone() : undefined,
radius: this.getRadius() radius: this.getRadius(),
offset: this.getOffset().slice()
}); });
style.setOpacity(this.getOpacity()); style.setOpacity(this.getOpacity());
style.setScale(this.getScale()); style.setScale(this.getScale());
+1 -6
View File
@@ -84,6 +84,7 @@ class Icon extends ImageStyle {
opacity: opacity, opacity: opacity,
rotation: rotation, rotation: rotation,
scale: scale, scale: scale,
offset: options.offset !== undefined ? options.offset : [0, 0],
rotateWithView: rotateWithView rotateWithView: rotateWithView
}); });
@@ -172,12 +173,6 @@ class Icon extends ImageStyle {
this.iconImage_ = getIconImage( this.iconImage_ = getIconImage(
image, /** @type {string} */ (src), imgSize, this.crossOrigin_, imageState, this.color_); image, /** @type {string} */ (src), imgSize, this.crossOrigin_, imageState, this.color_);
/**
* @private
* @type {Array<number>}
*/
this.offset_ = options.offset !== undefined ? options.offset : [0, 0];
/** /**
* @private * @private
* @type {import("./IconOrigin.js").default} * @type {import("./IconOrigin.js").default}
+18 -1
View File
@@ -10,6 +10,7 @@ import {abstract} from '../util.js';
* @property {boolean} rotateWithView * @property {boolean} rotateWithView
* @property {number} rotation * @property {number} rotation
* @property {number} scale * @property {number} scale
* @property {Array<number>} offset
*/ */
@@ -51,6 +52,12 @@ class ImageStyle {
*/ */
this.scale_ = options.scale; this.scale_ = options.scale;
/**
* @private
* @type {Array<number>}
*/
this.offset_ = options.offset;
} }
/** /**
@@ -63,7 +70,8 @@ class ImageStyle {
opacity: this.getOpacity(), opacity: this.getOpacity(),
scale: this.getScale(), scale: this.getScale(),
rotation: this.getRotation(), rotation: this.getRotation(),
rotateWithView: this.getRotateWithView() rotateWithView: this.getRotateWithView(),
offset: this.getOffset().slice()
}); });
} }
@@ -103,6 +111,15 @@ class ImageStyle {
return this.scale_; return this.scale_;
} }
/**
* Get the offset of the shape
* @return {Array<number>} Shape's center offset
* @api
*/
getOffset() {
return this.offset_;
}
/** /**
* Get the anchor point in pixels. The anchor determines the center point for the * Get the anchor point in pixels. The anchor determines the center point for the
* symbolizer. * symbolizer.
+4 -18
View File
@@ -20,7 +20,7 @@ import ImageStyle from './Image.js';
* @property {number} [radius1] Outer radius of a star. * @property {number} [radius1] Outer radius of a star.
* @property {number} [radius2] Inner 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 {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>} [offset] Offset of the shape * @property {Array<number>} [offset=[0,0]] Offset of the shape
* @property {import("./Stroke.js").default} [stroke] Stroke style. * @property {import("./Stroke.js").default} [stroke] Stroke style.
* @property {number} [rotation=0] Rotation in radians (positive rotation clockwise). * @property {number} [rotation=0] Rotation in radians (positive rotation clockwise).
* @property {boolean} [rotateWithView=false] Whether to rotate the shape with the view. * @property {boolean} [rotateWithView=false] Whether to rotate the shape with the view.
@@ -62,7 +62,8 @@ class RegularShape extends ImageStyle {
opacity: 1, opacity: 1,
rotateWithView: rotateWithView, rotateWithView: rotateWithView,
rotation: options.rotation !== undefined ? options.rotation : 0, rotation: options.rotation !== undefined ? options.rotation : 0,
scale: 1 scale: 1,
offset: options.offset !== undefined ? options.offset : [0, 0]
}); });
/** /**
@@ -89,12 +90,6 @@ class RegularShape extends ImageStyle {
*/ */
this.origin_ = [0, 0]; this.origin_ = [0, 0];
/**
* @private
* @type {Array<number>}
*/
this.offset_ = options.offset ? options.offset : [0, 0];
/** /**
* @private * @private
* @type {number} * @type {number}
@@ -168,7 +163,7 @@ class RegularShape extends ImageStyle {
stroke: this.getStroke() ? this.getStroke().clone() : undefined, stroke: this.getStroke() ? this.getStroke().clone() : undefined,
rotation: this.getRotation(), rotation: this.getRotation(),
rotateWithView: this.getRotateWithView(), rotateWithView: this.getRotateWithView(),
offset: this.getOffset() offset: this.getOffset().slice()
}); });
style.setOpacity(this.getOpacity()); style.setOpacity(this.getOpacity());
style.setScale(this.getScale()); style.setScale(this.getScale());
@@ -192,15 +187,6 @@ class RegularShape extends ImageStyle {
return this.angle_; return this.angle_;
} }
/**
* Get the offset of the shape
* @return {Array<number>} Shape's center offset
* @api
*/
getOffset() {
return this.offset_;
}
/** /**
* Get the fill style for the shape. * Get the fill style for the shape.
* @return {import("./Fill.js").default} Fill style. * @return {import("./Fill.js").default} Fill style.