diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 8d6611ca29..a7c0193eef 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -797,7 +797,16 @@ /** * @typedef {Object} olx.style.IconOptions - * @property {ol.Pixel|undefined} anchor Anchor. + * @property {ol.Pixel|undefined} anchor Anchor. Default value is [0.5, 0.5] + * (icon center). + * @property {ol.style.IconAnchorUnits|undefined} anchorXUnits Units in which the anchor x value is specified. + * A value of `'fraction'` indicates the x value is a fraction of the icon. + * A value of `'pixels'` indicates the x value in pixels. Default is + * `'fraction'`. + * @property {ol.style.IconAnchorUnits|undefined} anchorYUnits Units in which the anchor y value is specified. + * A value of `'fraction'` indicates the y value is a fraction of the icon. + * A value of `'pixels'` indicates the y value in pixels. Default is + * `'fraction'`. * @property {null|string|undefined} crossOrigin crossOrigin setting for image. * @property {number|undefined} scale Scale. * @property {number|undefined} rotation Rotation. diff --git a/src/ol/style/iconstyle.js b/src/ol/style/iconstyle.js index c4df241a40..7a4e74acdd 100644 --- a/src/ol/style/iconstyle.js +++ b/src/ol/style/iconstyle.js @@ -1,6 +1,7 @@ // FIXME decide default value for snapToPixel goog.provide('ol.style.Icon'); +goog.provide('ol.style.IconAnchorUnits'); goog.require('goog.array'); goog.require('goog.asserts'); @@ -12,6 +13,15 @@ goog.require('ol.style.Image'); goog.require('ol.style.ImageState'); +/** + * @enum {string} + */ +ol.style.IconAnchorUnits = { + FRACTION: 'fraction', + PIXELS: 'pixels' +}; + + /** * @constructor @@ -66,17 +76,24 @@ ol.style.Icon = function(opt_options) { */ var size = goog.isDef(options.size) ? options.size : null; + /** + * @private + * @type {ol.style.IconAnchorUnits} + */ + this.anchorXUnits_ = goog.isDef(options.anchorXUnits) ? + options.anchorXUnits : ol.style.IconAnchorUnits.FRACTION; + + /** + * @private + * @type {ol.style.IconAnchorUnits} + */ + this.anchorYUnits_ = goog.isDef(options.anchorYUnits) ? + options.anchorYUnits : ol.style.IconAnchorUnits.FRACTION; + /** * @type {ol.Pixel} */ - var anchor; - if (goog.isDef(options.anchor)) { - anchor = options.anchor; - } else if (!goog.isNull(size)) { - anchor = [size[0] / 2, size[1] / 2]; - } else { - anchor = null; - } + var anchor = goog.isDef(options.anchor) ? options.anchor : [0.5, 0.5]; /** * @type {number} @@ -139,8 +156,11 @@ ol.style.Icon.prototype.handleImageLoad_ = function() { if (goog.isNull(this.size)) { this.size = [this.image_.width, this.image_.height]; } - if (goog.isNull(this.anchor)) { - this.anchor = [this.size[0] / 2, this.size[1] / 2]; + if (this.anchorXUnits_ == ol.style.IconAnchorUnits.FRACTION) { + this.anchor[0] = this.size[0] * this.anchor[0]; + } + if (this.anchorYUnits_ == ol.style.IconAnchorUnits.FRACTION) { + this.anchor[1] = this.size[1] * this.anchor[1]; } this.unlistenImage_(); this.determineTainting_();