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

Fix some RegularShape bugs related to canvsa size

Browse Source 
- remove jitter when using RegularShape size in animation, size should
always be an integer
- canvas may have been too small for miter line join
- canvas was at least one stroke width too large for round line join
- reduce canvas size even more for bevel line join

Canvas now precisely fits the shape including stroke, The angle of the
shape is ignored for the calculation.
This commit is contained in:
Maximilian Krög
2021-07-04 15:11:35 +02:00
parent f21513ab5a
commit 87f215939c
3 changed files with 182 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
test/browser/spec/ol/style/circle.test.js
+12 -12
View File
@@ -7,14 +7,14 @@ describe('ol.style.Circle', function () {
it('creates a canvas (no fill-style)', function () {
const style = new CircleStyle({radius: 10});
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getSize()).to.eql([20, 20]);
expect(style.getImageSize()).to.eql([20, 20]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
expect(style.getAnchor()).to.eql([10, 10]);
// no hit-detection image is created, because no fill style is set
expect(style.getImage(1)).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionImageSize()).to.eql([20, 20]);
});
it('creates a canvas (transparent fill-style)', function () {
@@ -25,14 +25,14 @@ describe('ol.style.Circle', function () {
}),
});
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getSize()).to.eql([20, 20]);
expect(style.getImageSize()).to.eql([20, 20]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
expect(style.getAnchor()).to.eql([10, 10]);
// hit-detection image is created, because transparent fill style is set
expect(style.getImage(1)).to.not.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionImageSize()).to.eql([20, 20]);
});
it('creates a canvas (non-transparent fill-style)', function () {
@@ -43,14 +43,14 @@ describe('ol.style.Circle', function () {
}),
});
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getSize()).to.eql([20, 20]);
expect(style.getImageSize()).to.eql([20, 20]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
expect(style.getAnchor()).to.eql([10, 10]);
// no hit-detection image is created, because non-transparent fill style is set
expect(style.getImage(1)).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionImageSize()).to.eql([20, 20]);
});
});