Have high resolution regular shape

This commit is contained in:
Stéphane Brunner
2020-07-14 14:50:46 +02:00
parent 2dd9342a98
commit f2fe6e5957
5 changed files with 142 additions and 68 deletions

View File

@@ -6,14 +6,14 @@ describe('ol.style.Circle', function () {
describe('#constructor', function () {
it('creates a canvas (no fill-style)', function () {
const style = new CircleStyle({radius: 10});
expect(style.getImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
// no hit-detection image is created, because no fill style is set
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be(style.getHitDetectionImage(1));
expect(style.getHitDetectionImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
});
@@ -24,14 +24,14 @@ describe('ol.style.Circle', function () {
color: 'transparent',
}),
});
expect(style.getImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
// hit-detection image is created, because transparent fill style is set
expect(style.getImage()).to.not.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.not.be(style.getHitDetectionImage(1));
expect(style.getHitDetectionImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
});
@@ -42,14 +42,14 @@ describe('ol.style.Circle', function () {
color: '#FFFF00',
}),
});
expect(style.getImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
// no hit-detection image is created, because non-transparent fill style is set
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be(style.getHitDetectionImage(1));
expect(style.getHitDetectionImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
});
});

View File

@@ -32,14 +32,14 @@ describe('ol.style.RegularShape', function () {
it('creates a canvas (no fill-style)', function () {
const style = new RegularShape({radius: 10});
expect(style.getImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
// no hit-detection image is created, because no fill style is set
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be(style.getHitDetectionImage(1));
expect(style.getHitDetectionImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
});
@@ -50,15 +50,20 @@ describe('ol.style.RegularShape', function () {
color: 'transparent',
}),
});
expect(style.getImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getImage(1).width).to.be(21);
expect(style.getImage(2).width).to.be(42);
expect(style.getPixelRatio(2)).to.be(2);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
// hit-detection image is created, because transparent fill style is set
expect(style.getImage()).to.not.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.not.be(style.getHitDetectionImage(1));
expect(style.getHitDetectionImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
expect(style.getHitDetectionImage(1).width).to.be(21);
expect(style.getHitDetectionImage(2).width).to.be(42);
});
it('creates a canvas (non-transparent fill-style)', function () {
@@ -68,14 +73,14 @@ describe('ol.style.RegularShape', function () {
color: '#FFFF00',
}),
});
expect(style.getImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getSize()).to.eql([21, 21]);
expect(style.getImageSize()).to.eql([21, 21]);
expect(style.getOrigin()).to.eql([0, 0]);
expect(style.getAnchor()).to.eql([10.5, 10.5]);
// no hit-detection image is created, because non-transparent fill style is set
expect(style.getImage()).to.be(style.getHitDetectionImage());
expect(style.getHitDetectionImage()).to.be.an(HTMLCanvasElement);
expect(style.getImage(1)).to.be(style.getHitDetectionImage(1));
expect(style.getHitDetectionImage(1)).to.be.an(HTMLCanvasElement);
expect(style.getHitDetectionImageSize()).to.eql([21, 21]);
});