ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #3065 from tsauerwein/webgl-point-hit-detection

Browse Source 
Add hit-detection support for WebGL
This commit is contained in:
Tobias Sauerwein
2015-01-22 10:19:37 +01:00
parent f625a29978 974823dbd4
commit 53f98dcf4e
17 changed files with 609 additions and 156 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
examples/icon.js
View File

@@ -5,7 +5,7 @@ goog.require('ol.View');
goog.require('ol.geom.Point');
goog.require('ol.layer.Tile');
goog.require('ol.layer.Vector');
goog.require('ol.source.TileJSON');
goog.require('ol.source.OSM');
goog.require('ol.source.Vector');
goog.require('ol.style.Icon');
goog.require('ol.style.Style');
@@ -39,12 +39,11 @@ var vectorLayer = new ol.layer.Vector({
});
var rasterLayer = new ol.layer.Tile({
source: new ol.source.TileJSON({
url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.jsonp'
})
source: new ol.source.OSM()
});
var map = new ol.Map({
renderer: exampleNS.getRendererFromQueryString(),
layers: [rasterLayer, vectorLayer],
target: document.getElementById('map'),
view: new ol.View({

2
src/ol/render/canvas/canvasreplay.js
View File

@@ -1951,6 +1951,8 @@ ol.render.canvas.ReplayGroup.prototype.replay = function(
var zs = goog.array.map(goog.object.getKeys(this.replaysByZIndex_), Number);
goog.array.sort(zs);
// setup clipping so that the parts of over-simplified geometries are not
// visible outside the current extent when panning
var maxExtent = this.maxExtent_;
var minX = maxExtent[0];
var minY = maxExtent[1];

357
src/ol/render/webgl/webglreplay.js
View File

@@ -13,6 +13,7 @@ goog.require('ol.render.webgl.imagereplay.shader.Color');
goog.require('ol.render.webgl.imagereplay.shader.Default');
goog.require('ol.vec.Mat4');
goog.require('ol.webgl.Buffer');
goog.require('ol.webgl.Context');
@@ -60,6 +61,12 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) {
*/
this.groupIndices_ = [];
/**
* @type {Array.<number>}
* @private
*/
this.hitDetectionGroupIndices_ = [];
/**
* @type {number|undefined}
* @private
@@ -72,6 +79,12 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) {
*/
this.images_ = [];
/**
* @type {Array.<HTMLCanvasElement|HTMLImageElement|HTMLVideoElement>}
* @private
*/
this.hitDetectionImages_ = [];
/**
* @type {number|undefined}
* @private
@@ -168,6 +181,12 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) {
*/
this.textures_ = [];
/**
* @type {Array.<WebGLTexture>}
* @private
*/
this.hitDetectionTextures_ = [];
/**
* @type {Array.<number>}
* @private
@@ -180,6 +199,20 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) {
*/
this.verticesBuffer_ = null;
/**
* Start index per feature (the index).
* @type {Array.<number>}
* @private
*/
this.startIndices_ = [];
/**
* Start index per feature (the feature).
* @type {Array.<ol.Feature>}
* @private
*/
this.startIndicesFeature_ = [];
/**
* @type {number|undefined}
* @private
@@ -204,6 +237,7 @@ ol.render.webgl.ImageReplay.prototype.getDeleteResourcesFunction =
var verticesBuffer = this.verticesBuffer_;
var indicesBuffer = this.indicesBuffer_;
var textures = this.textures_;
var hitDetectionTextures = this.hitDetectionTextures_;
var gl = context.getGL();
return function() {
if (!gl.isContextLost()) {
@@ -211,6 +245,9 @@ ol.render.webgl.ImageReplay.prototype.getDeleteResourcesFunction =
for (i = 0, ii = textures.length; i < ii; ++i) {
gl.deleteTexture(textures[i]);
}
for (i = 0, ii = hitDetectionTextures.length; i < ii; ++i) {
gl.deleteTexture(hitDetectionTextures[i]);
}
}
context.deleteBuffer(verticesBuffer);
context.deleteBuffer(indicesBuffer);
@@ -377,6 +414,8 @@ ol.render.webgl.ImageReplay.prototype.drawMultiLineStringGeometry =
*/
ol.render.webgl.ImageReplay.prototype.drawMultiPointGeometry =
function(multiPointGeometry, feature) {
this.startIndices_.push(this.indices_.length);
this.startIndicesFeature_.push(feature);
var flatCoordinates = multiPointGeometry.getFlatCoordinates();
var stride = multiPointGeometry.getStride();
this.drawCoordinates_(
@@ -396,6 +435,8 @@ ol.render.webgl.ImageReplay.prototype.drawMultiPolygonGeometry =
*/
ol.render.webgl.ImageReplay.prototype.drawPointGeometry =
function(pointGeometry, feature) {
this.startIndices_.push(this.indices_.length);
this.startIndicesFeature_.push(feature);
var flatCoordinates = pointGeometry.getFlatCoordinates();
var stride = pointGeometry.getStride();
this.drawCoordinates_(
@@ -422,7 +463,10 @@ ol.render.webgl.ImageReplay.prototype.finish = function(context) {
var gl = context.getGL();
this.groupIndices_.push(this.indices_.length);
goog.asserts.assert(this.images_.length == this.groupIndices_.length);
goog.asserts.assert(this.images_.length === this.groupIndices_.length);
this.hitDetectionGroupIndices_.push(this.indices_.length);
goog.asserts.assert(this.hitDetectionImages_.length ===
this.hitDetectionGroupIndices_.length);
// create, bind, and populate the vertices buffer
this.verticesBuffer_ = new ol.webgl.Buffer(this.vertices_);
@@ -438,44 +482,23 @@ ol.render.webgl.ImageReplay.prototype.finish = function(context) {
this.indicesBuffer_ = new ol.webgl.Buffer(indices);
context.bindBuffer(goog.webgl.ELEMENT_ARRAY_BUFFER, this.indicesBuffer_);
goog.asserts.assert(this.textures_.length === 0);
// create textures
var texture, image, uid;
/** @type {Object.<string, WebGLTexture>} */
var texturePerImage = {};
var i;
var ii = this.images_.length;
for (i = 0; i < ii; ++i) {
image = this.images_[i];
uid = goog.getUid(image).toString();
if (goog.object.containsKey(texturePerImage, uid)) {
texture = texturePerImage[uid];
} else {
texture = gl.createTexture();
gl.bindTexture(goog.webgl.TEXTURE_2D, texture);
gl.texParameteri(goog.webgl.TEXTURE_2D,
goog.webgl.TEXTURE_WRAP_S, goog.webgl.CLAMP_TO_EDGE);
gl.texParameteri(goog.webgl.TEXTURE_2D,
goog.webgl.TEXTURE_WRAP_T, goog.webgl.CLAMP_TO_EDGE);
gl.texParameteri(goog.webgl.TEXTURE_2D,
goog.webgl.TEXTURE_MIN_FILTER, goog.webgl.LINEAR);
gl.texParameteri(goog.webgl.TEXTURE_2D,
goog.webgl.TEXTURE_MAG_FILTER, goog.webgl.LINEAR);
gl.texImage2D(goog.webgl.TEXTURE_2D, 0, goog.webgl.RGBA, goog.webgl.RGBA,
goog.webgl.UNSIGNED_BYTE, image);
texturePerImage[uid] = texture;
}
this.textures_[i] = texture;
}
this.createTextures_(this.textures_, this.images_, texturePerImage, gl);
goog.asserts.assert(this.textures_.length === this.groupIndices_.length);
goog.asserts.assert(this.textures_.length == this.groupIndices_.length);
this.createTextures_(this.hitDetectionTextures_, this.hitDetectionImages_,
texturePerImage, gl);
goog.asserts.assert(this.hitDetectionTextures_.length ===
this.hitDetectionGroupIndices_.length);
this.anchorX_ = undefined;
this.anchorY_ = undefined;
this.height_ = undefined;
this.images_ = null;
this.hitDetectionImages_ = null;
this.imageHeight_ = undefined;
this.imageWidth_ = undefined;
this.indices_ = null;
@@ -490,6 +513,36 @@ ol.render.webgl.ImageReplay.prototype.finish = function(context) {
};
/**
* @private
* @param {Array.<WebGLTexture>} textures Textures.
* @param {Array.<HTMLCanvasElement|HTMLImageElement|HTMLVideoElement>} images
* Images.
* @param {Object.<string, WebGLTexture>} texturePerImage Texture cache.
* @param {WebGLRenderingContext} gl Gl.
*/
ol.render.webgl.ImageReplay.prototype.createTextures_ =
function(textures, images, texturePerImage, gl) {
goog.asserts.assert(textures.length === 0);
var texture, image, uid, i;
var ii = images.length;
for (i = 0; i < ii; ++i) {
image = images[i];
uid = goog.getUid(image).toString();
if (goog.object.containsKey(texturePerImage, uid)) {
texture = texturePerImage[uid];
} else {
texture = ol.webgl.Context.createTexture(
gl, image, goog.webgl.CLAMP_TO_EDGE, goog.webgl.CLAMP_TO_EDGE);
texturePerImage[uid] = texture;
}
textures[i] = texture;
}
};
/**
* @param {ol.webgl.Context} context Context.
* @param {ol.Coordinate} center Center.
@@ -503,12 +556,16 @@ ol.render.webgl.ImageReplay.prototype.finish = function(context) {
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object} skippedFeaturesHash Ids of features to skip.
* @param {function(ol.Feature): T|undefined} featureCallback Feature callback.
* @param {ol.Extent=} opt_hitExtent Hit extent: Only features intersecting
* this extent are checked.
* @return {T|undefined} Callback result.
* @template T
*/
ol.render.webgl.ImageReplay.prototype.replay = function(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash) {
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
featureCallback, opt_hitExtent) {
var gl = context.getGL();
// bind the vertices buffer
@@ -609,17 +666,13 @@ ol.render.webgl.ImageReplay.prototype.replay = function(context,
}
// draw!
goog.asserts.assert(this.textures_.length == this.groupIndices_.length);
var i, ii, start;
for (i = 0, ii = this.textures_.length, start = 0; i < ii; ++i) {
gl.bindTexture(goog.webgl.TEXTURE_2D, this.textures_[i]);
var end = this.groupIndices_[i];
var numItems = end - start;
var offsetInBytes = start * (context.hasOESElementIndexUint ? 4 : 2);
var elementType = context.hasOESElementIndexUint ?
goog.webgl.UNSIGNED_INT : goog.webgl.UNSIGNED_SHORT;
gl.drawElements(goog.webgl.TRIANGLES, numItems, elementType, offsetInBytes);
start = end;
var result;
if (!goog.isDef(featureCallback)) {
this.drawReplay_(gl, context);
} else {
// draw feature by feature for the hit-detection
result = this.drawHitDetectionReplay_(gl, context, featureCallback,
opt_hitExtent);
}
// disable the vertex attrib arrays
@@ -628,6 +681,85 @@ ol.render.webgl.ImageReplay.prototype.replay = function(context,
gl.disableVertexAttribArray(locations.a_texCoord);
gl.disableVertexAttribArray(locations.a_opacity);
gl.disableVertexAttribArray(locations.a_rotateWithView);
return result;
};
/**
* @private
* @param {WebGLRenderingContext} gl gl.
* @param {ol.webgl.Context} context Context.
*/
ol.render.webgl.ImageReplay.prototype.drawReplay_ =
function(gl, context) {
goog.asserts.assert(this.textures_.length === this.groupIndices_.length);
var elementType = context.hasOESElementIndexUint ?
goog.webgl.UNSIGNED_INT : goog.webgl.UNSIGNED_SHORT;
var elementSize = context.hasOESElementIndexUint ? 4 : 2;
var i, ii, start;
for (i = 0, ii = this.textures_.length, start = 0; i < ii; ++i) {
gl.bindTexture(goog.webgl.TEXTURE_2D, this.textures_[i]);
var end = this.groupIndices_[i];
var numItems = end - start;
var offsetInBytes = start * elementSize;
gl.drawElements(goog.webgl.TRIANGLES, numItems, elementType, offsetInBytes);
start = end;
}
};
/**
* @private
* @param {WebGLRenderingContext} gl gl.
* @param {ol.webgl.Context} context Context.
* @param {function(ol.Feature): T|undefined} featureCallback Feature callback.
* @param {ol.Extent=} opt_hitExtent Hit extent: Only features intersecting
* this extent are checked.
* @return {T|undefined} Callback result.
* @template T
*/
ol.render.webgl.ImageReplay.prototype.drawHitDetectionReplay_ =
function(gl, context, featureCallback, opt_hitExtent) {
goog.asserts.assert(this.hitDetectionTextures_.length ===
this.hitDetectionGroupIndices_.length);
var elementType = context.hasOESElementIndexUint ?
goog.webgl.UNSIGNED_INT : goog.webgl.UNSIGNED_SHORT;
var elementSize = context.hasOESElementIndexUint ? 4 : 2;
var i, groupStart, groupEnd, numItems, start, end, feature;
var featureIndex = this.startIndices_.length - 1;
for (i = this.hitDetectionTextures_.length - 1; i >= 0; --i) {
gl.bindTexture(goog.webgl.TEXTURE_2D, this.hitDetectionTextures_[i]);
groupStart = (i > 0) ? this.hitDetectionGroupIndices_[i - 1] : 0;
end = this.hitDetectionGroupIndices_[i];
// draw all features for this texture group
while (featureIndex >= 0 &&
this.startIndices_[featureIndex] >= groupStart) {
start = this.startIndices_[featureIndex];
numItems = end - start;
feature = this.startIndicesFeature_[featureIndex];
if (!goog.isDef(opt_hitExtent) || ol.extent.intersects(
opt_hitExtent, feature.getGeometry().getExtent())) {
var offsetInBytes = start * elementSize;
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
gl.drawElements(
goog.webgl.TRIANGLES, numItems, elementType, offsetInBytes);
var result = featureCallback(feature);
if (result) {
return result;
}
}
end = start;
featureIndex--;
}
}
return undefined;
};
@@ -647,6 +779,10 @@ ol.render.webgl.ImageReplay.prototype.setImageStyle = function(imageStyle) {
goog.asserts.assert(!goog.isNull(image));
var imageSize = imageStyle.getImageSize();
goog.asserts.assert(!goog.isNull(imageSize));
var hitDetectionImage = imageStyle.getHitDetectionImage(1);
goog.asserts.assert(!goog.isNull(hitDetectionImage));
var hitDetectionImageSize = imageStyle.getHitDetectionImageSize();
goog.asserts.assert(!goog.isNull(hitDetectionImageSize));
var opacity = imageStyle.getOpacity();
goog.asserts.assert(goog.isDef(opacity));
var origin = imageStyle.getOrigin();
@@ -660,17 +796,31 @@ ol.render.webgl.ImageReplay.prototype.setImageStyle = function(imageStyle) {
var scale = imageStyle.getScale();
goog.asserts.assert(goog.isDef(scale));
var currentImage;
if (this.images_.length === 0) {
this.images_.push(image);
} else {
var currentImage = this.images_[this.images_.length - 1];
currentImage = this.images_[this.images_.length - 1];
if (goog.getUid(currentImage) != goog.getUid(image)) {
this.groupIndices_.push(this.indices_.length);
goog.asserts.assert(this.groupIndices_.length == this.images_.length);
goog.asserts.assert(this.groupIndices_.length === this.images_.length);
this.images_.push(image);
}
}
if (this.hitDetectionImages_.length === 0) {
this.hitDetectionImages_.push(hitDetectionImage);
} else {
currentImage =
this.hitDetectionImages_[this.hitDetectionImages_.length - 1];
if (goog.getUid(currentImage) != goog.getUid(hitDetectionImage)) {
this.hitDetectionGroupIndices_.push(this.indices_.length);
goog.asserts.assert(this.hitDetectionGroupIndices_.length ===
this.hitDetectionImages_.length);
this.hitDetectionImages_.push(hitDetectionImage);
}
}
this.anchorX_ = anchor[0];
this.anchorY_ = anchor[1];
this.height_ = size[1];
@@ -698,9 +848,11 @@ ol.render.webgl.ImageReplay.prototype.setTextStyle = goog.abstractMethod;
* @implements {ol.render.IReplayGroup}
* @param {number} tolerance Tolerance.
* @param {ol.Extent} maxExtent Max extent.
* @param {number=} opt_renderBuffer Render buffer.
* @struct
*/
ol.render.webgl.ReplayGroup = function(tolerance, maxExtent) {
ol.render.webgl.ReplayGroup = function(
tolerance, maxExtent, opt_renderBuffer) {
/**
* @type {ol.Extent}
@@ -714,6 +866,12 @@ ol.render.webgl.ReplayGroup = function(tolerance, maxExtent) {
*/
this.tolerance_ = tolerance;
/**
* @type {number|undefined}
* @private
*/
this.renderBuffer_ = opt_renderBuffer;
/**
* ImageReplay only is supported at this point.
* @type {Object.<ol.render.ReplayType, ol.render.webgl.ImageReplay>}
@@ -788,19 +946,55 @@ ol.render.webgl.ReplayGroup.prototype.isEmpty = function() {
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object} skippedFeaturesHash Ids of features to skip.
* @return {T|undefined} Callback result.
* @template T
*/
ol.render.webgl.ReplayGroup.prototype.replay = function(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash) {
var i, ii, replay, result;
for (i = 0, ii = ol.render.REPLAY_ORDER.length; i < ii; ++i) {
replay = this.replays_[ol.render.REPLAY_ORDER[i]];
if (goog.isDef(replay)) {
replay.replay(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
undefined);
}
}
};
/**
* @private
* @param {ol.webgl.Context} context Context.
* @param {ol.Coordinate} center Center.
* @param {number} resolution Resolution.
* @param {number} rotation Rotation.
* @param {ol.Size} size Size.
* @param {number} pixelRatio Pixel ratio.
* @param {number} opacity Global opacity.
* @param {number} brightness Global brightness.
* @param {number} contrast Global contrast.
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object} skippedFeaturesHash Ids of features to skip.
* @param {function(ol.Feature): T|undefined} featureCallback Feature callback.
* @param {ol.Extent=} opt_hitExtent Hit extent: Only features intersecting
* this extent are checked.
* @return {T|undefined} Callback result.
* @template T
*/
ol.render.webgl.ReplayGroup.prototype.replayHitDetection_ = function(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
featureCallback, opt_hitExtent) {
var i, replay, result;
for (i = ol.render.REPLAY_ORDER.length - 1; i >= 0; --i) {
replay = this.replays_[ol.render.REPLAY_ORDER[i]];
if (goog.isDef(replay)) {
result = replay.replay(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash);
opacity, brightness, contrast, hue, saturation,
skippedFeaturesHash, featureCallback, opt_hitExtent);
if (result) {
return result;
}
@@ -810,6 +1004,67 @@ ol.render.webgl.ReplayGroup.prototype.replay = function(context,
};
/**
* @param {ol.webgl.Context} context Context.
* @param {ol.Coordinate} center Center.
* @param {number} resolution Resolution.
* @param {number} rotation Rotation.
* @param {ol.Size} size Size.
* @param {number} pixelRatio Pixel ratio.
* @param {number} opacity Global opacity.
* @param {number} brightness Global brightness.
* @param {number} contrast Global contrast.
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object} skippedFeaturesHash Ids of features to skip.
* @param {ol.Coordinate} coordinate Coordinate.
* @param {function(ol.Feature): T|undefined} callback Feature callback.
* @return {T|undefined} Callback result.
* @template T
*/
ol.render.webgl.ReplayGroup.prototype.forEachFeatureAtPixel = function(
context, center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
coordinate, callback) {
var gl = context.getGL();
gl.bindFramebuffer(
gl.FRAMEBUFFER, context.getHitDetectionFramebuffer());
/**
* @type {ol.Extent}
*/
var hitExtent;
if (goog.isDef(this.renderBuffer_)) {
// build an extent around the coordinate, so that only features that
// intersect this extent are checked
hitExtent = ol.extent.buffer(
ol.extent.boundingExtent([coordinate]),
resolution * this.renderBuffer_);
}
return this.replayHitDetection_(context,
coordinate, resolution, rotation, ol.render.webgl.HIT_DETECTION_SIZE_,
pixelRatio, opacity, brightness, contrast, hue, saturation,
skippedFeaturesHash,
/**
* @param {ol.Feature} feature Feature.
* @return {?} Callback result.
*/
function(feature) {
var imageData = new Uint8Array(4);
gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
if (imageData[3] > 0) {
var result = callback(feature);
if (result) {
return result;
}
}
}, hitExtent);
};
/**
* @const
* @private
@@ -820,3 +1075,11 @@ ol.render.webgl.ReplayGroup.prototype.replay = function(context,
ol.render.webgl.BATCH_CONSTRUCTORS_ = {
'Image': ol.render.webgl.ImageReplay
};
/**
* @const
* @private
* @type {Array.<number>}
*/
ol.render.webgl.HIT_DETECTION_SIZE_ = [1, 1];

21
src/ol/renderer/webgl/webglimagelayerrenderer.js
View File

@@ -11,6 +11,7 @@ goog.require('ol.extent');
goog.require('ol.layer.Image');
goog.require('ol.proj');
goog.require('ol.renderer.webgl.Layer');
goog.require('ol.webgl.Context');
@@ -49,24 +50,8 @@ ol.renderer.webgl.ImageLayer.prototype.createTexture_ = function(image) {
var imageElement = image.getImage();
var gl = this.getWebGLMapRenderer().getGL();
var texture = gl.createTexture();
gl.bindTexture(goog.webgl.TEXTURE_2D, texture);
gl.texImage2D(goog.webgl.TEXTURE_2D, 0, goog.webgl.RGBA,
goog.webgl.RGBA, goog.webgl.UNSIGNED_BYTE, imageElement);
gl.texParameteri(
goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_WRAP_S,
goog.webgl.CLAMP_TO_EDGE);
gl.texParameteri(
goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_WRAP_T,
goog.webgl.CLAMP_TO_EDGE);
gl.texParameteri(
goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_MIN_FILTER, goog.webgl.LINEAR);
gl.texParameteri(
goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_MAG_FILTER, goog.webgl.LINEAR);
return texture;
return ol.webgl.Context.createTexture(
gl, imageElement, goog.webgl.CLAMP_TO_EDGE, goog.webgl.CLAMP_TO_EDGE);
};

12
src/ol/renderer/webgl/webgllayerrenderer.js
View File

@@ -11,6 +11,7 @@ goog.require('ol.renderer.Layer');
goog.require('ol.renderer.webgl.map.shader.Color');
goog.require('ol.renderer.webgl.map.shader.Default');
goog.require('ol.webgl.Buffer');
goog.require('ol.webgl.Context');
@@ -115,15 +116,8 @@ ol.renderer.webgl.Layer.prototype.bindFramebuffer =
}
}, gl, this.framebuffer, this.texture));
var texture = gl.createTexture();
gl.bindTexture(goog.webgl.TEXTURE_2D, texture);
gl.texImage2D(goog.webgl.TEXTURE_2D, 0, goog.webgl.RGBA,
framebufferDimension, framebufferDimension, 0, goog.webgl.RGBA,
goog.webgl.UNSIGNED_BYTE, null);
gl.texParameteri(goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_MAG_FILTER,
goog.webgl.LINEAR);
gl.texParameteri(goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_MIN_FILTER,
goog.webgl.LINEAR);
var texture = ol.webgl.Context.createEmptyTexture(
gl, framebufferDimension, framebufferDimension);
var framebuffer = gl.createFramebuffer();
gl.bindFramebuffer(goog.webgl.FRAMEBUFFER, framebuffer);

85
src/ol/renderer/webgl/webglmaprenderer.js
View File

@@ -290,13 +290,10 @@ ol.renderer.webgl.Map.prototype.dispatchComposeEvent_ =
replayGroup.finish(context);
if (!replayGroup.isEmpty()) {
// use default color values
var opacity = 1;
var brightness = 0;
var contrast = 1;
var hue = 0;
var saturation = 1;
var d = ol.renderer.webgl.Map.DEFAULT_COLOR_VALUES_;
replayGroup.replay(context, center, resolution, rotation, size,
pixelRatio, opacity, brightness, contrast, hue, saturation, {});
pixelRatio, d.opacity, d.brightness, d.contrast,
d.hue, d.saturation, {});
}
replayGroup.getDeleteResourcesFunction(context)();
@@ -538,3 +535,79 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
this.scheduleExpireIconCache(frameState);
};
/**
* @inheritDoc
*/
ol.renderer.webgl.Map.prototype.forEachFeatureAtPixel =
function(coordinate, frameState, callback, thisArg,
layerFilter, thisArg2) {
var result;
if (this.getGL().isContextLost()) {
return false;
}
var context = this.getContext();
var viewState = frameState.viewState;
// do the hit-detection for the overlays first
if (!goog.isNull(this.replayGroup)) {
/** @type {Object.<string, boolean>} */
var features = {};
// use default color values
var d = ol.renderer.webgl.Map.DEFAULT_COLOR_VALUES_;
result = this.replayGroup.forEachFeatureAtPixel(context,
viewState.center, viewState.resolution, viewState.rotation,
frameState.size, frameState.pixelRatio,
d.opacity, d.brightness, d.contrast, d.hue, d.saturation, {},
coordinate,
/**
* @param {ol.Feature} feature Feature.
* @return {?} Callback result.
*/
function(feature) {
goog.asserts.assert(goog.isDef(feature));
var key = goog.getUid(feature).toString();
if (!(key in features)) {
features[key] = true;
return callback.call(thisArg, feature, null);
}
});
if (result) {
return result;
}
}
var layerStates = this.getMap().getLayerGroup().getLayerStatesArray();
var numLayers = layerStates.length;
var i;
for (i = numLayers - 1; i >= 0; --i) {
var layerState = layerStates[i];
var layer = layerState.layer;
if (ol.layer.Layer.visibleAtResolution(layerState, viewState.resolution) &&
layerFilter.call(thisArg2, layer)) {
var layerRenderer = this.getLayerRenderer(layer);
result = layerRenderer.forEachFeatureAtPixel(
coordinate, frameState, callback, thisArg);
if (result) {
return result;
}
}
}
return undefined;
};
/**
* @private
*/
ol.renderer.webgl.Map.DEFAULT_COLOR_VALUES_ = {
opacity: 1,
brightness: 0,
contrast: 1,
hue: 0,
saturation: 1
};

39
src/ol/renderer/webgl/webglvectorlayerrenderer.js
View File

@@ -58,6 +58,13 @@ ol.renderer.webgl.VectorLayer = function(mapRenderer, vectorLayer) {
*/
this.replayGroup_ = null;
/**
* The last layer state.
* @private
* @type {?ol.layer.LayerState}
*/
this.layerState_ = null;
};
goog.inherits(ol.renderer.webgl.VectorLayer, ol.renderer.webgl.Layer);
@@ -67,6 +74,7 @@ goog.inherits(ol.renderer.webgl.VectorLayer, ol.renderer.webgl.Layer);
*/
ol.renderer.webgl.VectorLayer.prototype.composeFrame =
function(frameState, layerState, context) {
this.layerState_ = layerState;
var viewState = frameState.viewState;
var replayGroup = this.replayGroup_;
if (!goog.isNull(replayGroup) && !replayGroup.isEmpty()) {
@@ -100,6 +108,35 @@ ol.renderer.webgl.VectorLayer.prototype.disposeInternal = function() {
*/
ol.renderer.webgl.VectorLayer.prototype.forEachFeatureAtPixel =
function(coordinate, frameState, callback, thisArg) {
if (goog.isNull(this.replayGroup_) || goog.isNull(this.layerState_)) {
return undefined;
} else {
var mapRenderer = this.getWebGLMapRenderer();
var context = mapRenderer.getContext();
var viewState = frameState.viewState;
var layer = this.getLayer();
var layerState = this.layerState_;
/** @type {Object.<string, boolean>} */
var features = {};
return this.replayGroup_.forEachFeatureAtPixel(context,
viewState.center, viewState.resolution, viewState.rotation,
frameState.size, frameState.pixelRatio,
layerState.opacity, layerState.brightness, layerState.contrast,
layerState.hue, layerState.saturation, frameState.skippedFeatureUids,
coordinate,
/**
* @param {ol.Feature} feature Feature.
* @return {?} Callback result.
*/
function(feature) {
goog.asserts.assert(goog.isDef(feature));
var key = goog.getUid(feature).toString();
if (!(key in features)) {
features[key] = true;
return callback.call(thisArg, feature, layer);
}
});
}
};
@@ -167,7 +204,7 @@ ol.renderer.webgl.VectorLayer.prototype.prepareFrame =
var replayGroup = new ol.render.webgl.ReplayGroup(
ol.renderer.vector.getTolerance(resolution, pixelRatio),
extent);
extent, vectorLayer.getRenderBuffer());
vectorSource.loadFeatures(extent, resolution, projection);
var renderFeature =
/**

32
src/ol/style/atlasmanager.js
View File

@@ -11,12 +11,10 @@ goog.require('ol');
/**
* Provides information for an image inside an atlas manager.
* `offsetX` and `offsetY` is the position of the image inside
* the atlas image `image`.
* `hitOffsetX` and `hitOffsetY` ist the position of the hit-detection image
* inside the hit-detection atlas image `hitImage` (only when a hit-detection
* image was created for this image).
* the atlas image `image` and the position of the hit-detection image
* inside the hit-detection atlas image `hitImage`.
* @typedef {{offsetX: number, offsetY: number, image: HTMLCanvasElement,
* hitOffsetX: number, hitOffsetY: number, hitImage: HTMLCanvasElement}}
* hitImage: HTMLCanvasElement}}
*/
ol.style.AtlasManagerInfo;
@@ -103,6 +101,7 @@ ol.style.AtlasManager.prototype.getInfo = function(id) {
}
/** @type {?ol.style.AtlasInfo} */
var hitInfo = this.getInfo_(this.hitAtlases_, id);
goog.asserts.assert(!goog.isNull(hitInfo));
return this.mergeInfos_(info, hitInfo);
};
@@ -131,19 +130,19 @@ ol.style.AtlasManager.prototype.getInfo_ = function(atlases, id) {
/**
* @private
* @param {ol.style.AtlasInfo} info The info for the real image.
* @param {?ol.style.AtlasInfo} hitInfo The info for the hit-detection
* @param {ol.style.AtlasInfo} hitInfo The info for the hit-detection
* image.
* @return {?ol.style.AtlasManagerInfo} The position and atlas image for the
* entry, or `null` if the entry is not part of the atlases.
*/
ol.style.AtlasManager.prototype.mergeInfos_ = function(info, hitInfo) {
goog.asserts.assert(info.offsetX === hitInfo.offsetX);
goog.asserts.assert(info.offsetY === hitInfo.offsetY);
return /** @type {ol.style.AtlasManagerInfo} */ ({
offsetX: info.offsetX,
offsetY: info.offsetY,
image: info.image,
hitOffsetX: goog.isNull(hitInfo) ? undefined : hitInfo.offsetX,
hitOffsetY: goog.isNull(hitInfo) ? undefined : hitInfo.offsetY,
hitImage: goog.isNull(hitInfo) ? undefined : hitInfo.image
hitImage: hitInfo.image
});
};
@@ -185,12 +184,17 @@ ol.style.AtlasManager.prototype.add =
return null;
}
// even if no hit-detection entry is requested, we insert a fake entry into
// the hit-detection atlas, to make sure that the offset is the same for
// the original image and the hit-detection image.
var renderHitCallback = goog.isDef(opt_renderHitCallback) ?
opt_renderHitCallback : goog.functions.NULL;
/** @type {?ol.style.AtlasInfo} */
var hitInfo = null;
if (goog.isDef(opt_renderHitCallback)) {
hitInfo = this.add_(true,
id, width, height, opt_renderHitCallback, opt_this);
}
var hitInfo = this.add_(true,
id, width, height, renderHitCallback, opt_this);
goog.asserts.assert(!goog.isNull(hitInfo));
return this.mergeInfos_(info, hitInfo);
};

16
src/ol/style/circlestyle.js
View File

@@ -70,12 +70,6 @@ ol.style.Circle = function(opt_options) {
*/
this.origin_ = [0, 0];
/**
* @private
* @type {Array.<number>}
*/
this.hitDetectionOrigin_ = [0, 0];
/**
* @private
* @type {Array.<number>}
@@ -189,14 +183,6 @@ ol.style.Circle.prototype.getOrigin = function() {
};
/**
* @inheritDoc
*/
ol.style.Circle.prototype.getHitDetectionOrigin = function() {
return this.hitDetectionOrigin_;
};
/**
* @return {number} Radius.
* @api
@@ -323,12 +309,10 @@ ol.style.Circle.prototype.render_ = function(atlasManager) {
if (hasCustomHitDetectionImage) {
this.hitDetectionCanvas_ = info.hitImage;
this.hitDetectionOrigin_ = [info.hitOffsetX, info.hitOffsetY];
this.hitDetectionImageSize_ =
[info.hitImage.width, info.hitImage.height];
} else {
this.hitDetectionCanvas_ = this.canvas_;
this.hitDetectionOrigin_ = this.origin_;
this.hitDetectionImageSize_ = [imageSize, imageSize];
}
}

8
src/ol/style/iconstyle.js
View File

@@ -301,14 +301,6 @@ ol.style.Icon.prototype.getOrigin = function() {
};
/**
* @inheritDoc
*/
ol.style.Icon.prototype.getHitDetectionOrigin = function() {
return this.getOrigin();
};
/**
* @return {string|undefined} Image src.
* @api

7
src/ol/style/imagestyle.js
View File

@@ -161,13 +161,6 @@ ol.style.Image.prototype.getHitDetectionImageSize = goog.abstractMethod;
ol.style.Image.prototype.getOrigin = goog.abstractMethod;
/**
* @function
* @return {Array.<number>} Origin for the hit-detection image.
*/
ol.style.Image.prototype.getHitDetectionOrigin = goog.abstractMethod;
/**
* @function
* @return {ol.Size} Size.

16
src/ol/style/regularshapestyle.js
View File

@@ -60,12 +60,6 @@ ol.style.RegularShape = function(options) {
*/
this.origin_ = [0, 0];
/**
* @private
* @type {Array.<number>}
*/
this.hitDetectionOrigin_ = [0, 0];
/**
* @private
* @type {number}
@@ -219,14 +213,6 @@ ol.style.RegularShape.prototype.getOrigin = function() {
};
/**
* @inheritDoc
*/
ol.style.RegularShape.prototype.getHitDetectionOrigin = function() {
return this.hitDetectionOrigin_;
};
/**
* @return {number} Number of points for stars and regular polygons.
* @api
@@ -370,12 +356,10 @@ ol.style.RegularShape.prototype.render_ = function(atlasManager) {
if (hasCustomHitDetectionImage) {
this.hitDetectionCanvas_ = info.hitImage;
this.hitDetectionOrigin_ = [info.hitOffsetX, info.hitOffsetY];
this.hitDetectionImageSize_ =
[info.hitImage.width, info.hitImage.height];
} else {
this.hitDetectionCanvas_ = this.canvas_;
this.hitDetectionOrigin_ = this.origin_;
this.hitDetectionImageSize_ = [imageSize, imageSize];
}
}

126
src/ol/webgl/context.js
View File

@@ -66,6 +66,24 @@ ol.webgl.Context = function(canvas, gl) {
*/
this.currentProgram_ = null;
/**
* @private
* @type {WebGLFramebuffer}
*/
this.hitDetectionFramebuffer_ = null;
/**
* @private
* @type {WebGLTexture}
*/
this.hitDetectionTexture_ = null;
/**
* @private
* @type {WebGLRenderbuffer}
*/
this.hitDetectionRenderbuffer_ = null;
/**
* @type {boolean}
*/
@@ -153,6 +171,10 @@ ol.webgl.Context.prototype.disposeInternal = function() {
goog.object.forEach(this.shaderCache_, function(shader) {
gl.deleteShader(shader);
});
// delete objects for hit-detection
gl.deleteFramebuffer(this.hitDetectionFramebuffer_);
gl.deleteRenderbuffer(this.hitDetectionRenderbuffer_);
gl.deleteTexture(this.hitDetectionTexture_);
}
};
@@ -174,6 +196,18 @@ ol.webgl.Context.prototype.getGL = function() {
};
/**
* @return {WebGLFramebuffer} The framebuffer for the hit-detection.
* @api
*/
ol.webgl.Context.prototype.getHitDetectionFramebuffer = function() {
if (goog.isNull(this.hitDetectionFramebuffer_)) {
this.initHitDetectionFramebuffer_();
}
return this.hitDetectionFramebuffer_;
};
/**
* Get shader from the cache if it's in the cache. Otherwise, create
* the WebGL shader, compile it, and add entry to cache.
@@ -247,6 +281,9 @@ ol.webgl.Context.prototype.handleWebGLContextLost = function() {
goog.object.clear(this.shaderCache_);
goog.object.clear(this.programCache_);
this.currentProgram_ = null;
this.hitDetectionFramebuffer_ = null;
this.hitDetectionTexture_ = null;
this.hitDetectionRenderbuffer_ = null;
};
@@ -257,6 +294,34 @@ ol.webgl.Context.prototype.handleWebGLContextRestored = function() {
};
/**
* Creates a 1x1 pixel framebuffer for the hit-detection.
* @private
*/
ol.webgl.Context.prototype.initHitDetectionFramebuffer_ = function() {
var gl = this.gl_;
var framebuffer = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
var texture = ol.webgl.Context.createEmptyTexture(gl, 1, 1);
var renderbuffer = gl.createRenderbuffer();
gl.bindRenderbuffer(gl.RENDERBUFFER, renderbuffer);
gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, 1, 1);
gl.framebufferTexture2D(
gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture, 0);
gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT,
gl.RENDERBUFFER, renderbuffer);
gl.bindTexture(gl.TEXTURE_2D, null);
gl.bindRenderbuffer(gl.RENDERBUFFER, null);
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
this.hitDetectionFramebuffer_ = framebuffer;
this.hitDetectionTexture_ = texture;
this.hitDetectionRenderbuffer_ = renderbuffer;
};
/**
* Just return false if that program is used already. Other use
* that program (call `gl.useProgram`) and make it the "current
@@ -282,3 +347,64 @@ ol.webgl.Context.prototype.useProgram = function(program) {
* @type {goog.log.Logger}
*/
ol.webgl.Context.prototype.logger_ = goog.log.getLogger('ol.webgl.Context');
/**
* @param {WebGLRenderingContext} gl WebGL rendering context.
* @param {number=} opt_wrapS wrapS.
* @param {number=} opt_wrapT wrapT.
* @return {WebGLTexture}
* @private
*/
ol.webgl.Context.createTexture_ = function(gl, opt_wrapS, opt_wrapT) {
var texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
if (goog.isDef(opt_wrapS)) {
gl.texParameteri(
goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_WRAP_S, opt_wrapS);
}
if (goog.isDef(opt_wrapT)) {
gl.texParameteri(
goog.webgl.TEXTURE_2D, goog.webgl.TEXTURE_WRAP_T, opt_wrapT);
}
return texture;
};
/**
* @param {WebGLRenderingContext} gl WebGL rendering context.
* @param {number} width Width.
* @param {number} height Height.
* @param {number=} opt_wrapS wrapS.
* @param {number=} opt_wrapT wrapT.
* @return {WebGLTexture}
*/
ol.webgl.Context.createEmptyTexture = function(
gl, width, height, opt_wrapS, opt_wrapT) {
var texture = ol.webgl.Context.createTexture_(gl, opt_wrapS, opt_wrapT);
gl.texImage2D(
gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE,
null);
return texture;
};
/**
* @param {WebGLRenderingContext} gl WebGL rendering context.
* @param {HTMLCanvasElement|HTMLImageElement|HTMLVideoElement} image Image.
* @param {number=} opt_wrapS wrapS.
* @param {number=} opt_wrapT wrapT.
* @return {WebGLTexture}
*/
ol.webgl.Context.createTexture = function(gl, image, opt_wrapS, opt_wrapT) {
var texture = ol.webgl.Context.createTexture_(gl, opt_wrapS, opt_wrapT);
gl.texImage2D(
gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
return texture;
};

12
test/spec/ol/render/webglreplay.test.js
View File

@@ -16,9 +16,15 @@ describe('ol.render.webgl.ImageReplay', function() {
imageStyle.getImage = function() {
return image;
};
imageStyle.getHitDetectionImage = function() {
return image;
};
imageStyle.getImageSize = function() {
return [512, 512];
};
imageStyle.getHitDetectionImageSize = function() {
return [512, 512];
};
imageStyle.getOrigin = function() {
return [200, 200];
};
@@ -59,14 +65,20 @@ describe('ol.render.webgl.ImageReplay', function() {
expect(replay.width_).to.be(256);
expect(replay.images_).to.have.length(1);
expect(replay.groupIndices_).to.have.length(0);
expect(replay.hitDetectionImages_).to.have.length(1);
expect(replay.hitDetectionGroupIndices_).to.have.length(0);
replay.setImageStyle(imageStyle1);
expect(replay.images_).to.have.length(1);
expect(replay.groupIndices_).to.have.length(0);
expect(replay.hitDetectionImages_).to.have.length(1);
expect(replay.hitDetectionGroupIndices_).to.have.length(0);
replay.setImageStyle(imageStyle2);
expect(replay.images_).to.have.length(2);
expect(replay.groupIndices_).to.have.length(1);
expect(replay.hitDetectionImages_).to.have.length(2);
expect(replay.hitDetectionGroupIndices_).to.have.length(1);
});
});

17
test/spec/ol/style/atlasmanager.test.js
View File

@@ -191,7 +191,7 @@ describe('ol.style.AtlasManager', function() {
expect(info).to.eql({
offsetX: 1, offsetY: 1, image: manager.atlases_[0].canvas_,
hitOffsetX: undefined, hitOffsetY: undefined, hitImage: undefined});
hitImage: manager.hitAtlases_[0].canvas_});
expect(manager.getInfo('1')).to.eql(info);
});
@@ -202,7 +202,6 @@ describe('ol.style.AtlasManager', function() {
expect(info).to.eql({
offsetX: 1, offsetY: 1, image: manager.atlases_[0].canvas_,
hitOffsetX: 1, hitOffsetY: 1,
hitImage: manager.hitAtlases_[0].canvas_});
expect(manager.getInfo('1')).to.eql(info);
@@ -258,6 +257,20 @@ describe('ol.style.AtlasManager', function() {
expect(manager.add('2', 2048, 2048, defaultRender, defaultRender))
.to.eql(null);
});
it('always has the same offset for the hit-detection', function() {
var manager = new ol.style.AtlasManager({initialSize: 128});
// add one image without hit-detection callback
var info = manager.add('1', 32, 32, defaultRender);
// add then one with hit-detection callback
info = manager.add('2', 32, 32, defaultRender, defaultRender);
expect(info).to.eql({
offsetX: 34, offsetY: 1, image: manager.atlases_[0].canvas_,
hitImage: manager.hitAtlases_[0].canvas_});
expect(manager.getInfo('2')).to.eql(info);
});
});
describe('#getInfo', function() {

4
test/spec/ol/style/circlestyle.test.js
View File

@@ -16,7 +16,6 @@ describe('ol.style.Circle', function() {
expect(style.getImage()).to.not.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionOrigin()).to.eql([0, 0]);
});
it('creates a canvas if no atlas is used (fill-style)', function() {
@@ -35,7 +34,6 @@ describe('ol.style.Circle', function() {
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionOrigin()).to.eql([0, 0]);
});
it('adds itself to an atlas manager (no fill-style)', function() {
@@ -50,7 +48,6 @@ describe('ol.style.Circle', function() {
expect(style.getImage()).to.not.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([512, 512]);
expect(style.getHitDetectionOrigin()).to.eql([1, 1]);
});
it('adds itself to an atlas manager (fill-style)', function() {
@@ -71,7 +68,6 @@ describe('ol.style.Circle', function() {
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([512, 512]);
expect(style.getHitDetectionOrigin()).to.eql([1, 1]);
});
});

4
test/spec/ol/style/regularshapestyle.test.js
View File

@@ -49,7 +49,6 @@ describe('ol.style.RegularShape', function() {
expect(style.getImage()).to.not.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionOrigin()).to.eql([0, 0]);
});
it('creates a canvas if no atlas is used (fill-style)', function() {
@@ -68,7 +67,6 @@ describe('ol.style.RegularShape', function() {
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionOrigin()).to.eql([0, 0]);
});
it('adds itself to an atlas manager (no fill-style)', function() {
@@ -84,7 +82,6 @@ describe('ol.style.RegularShape', function() {
expect(style.getImage()).to.not.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([512, 512]);
expect(style.getHitDetectionOrigin()).to.eql([1, 1]);
});
it('adds itself to an atlas manager (fill-style)', function() {
@@ -105,7 +102,6 @@ describe('ol.style.RegularShape', function() {
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([512, 512]);
expect(style.getHitDetectionOrigin()).to.eql([1, 1]);
});
});