diff --git a/examples/chaikin.html b/examples/chaikin.html index cdcc94b60e..1a07bb2bd0 100644 --- a/examples/chaikin.html +++ b/examples/chaikin.html @@ -3,7 +3,7 @@ layout: example.html title: Smoothing lines using Chaikins algorithm shortdesc: This uses Chaikins algorithm to smooth drawn lines. docs: > - This example uses the npm package [`chaikin-smooth`](https://www.npmjs.com/package/chaikin-smooth) which + This example uses the npm package [`chaikin-smooth`](https://www.npmjs.com/package/chaikin-smooth) which implements [Chaikins algorithm](http://graphics.cs.ucdavis.edu/education/CAGDNotes/Chaikins-Algorithm/Chaikins-Algorithm.html) to smooth drawn lines. @@ -13,12 +13,6 @@ tags: "smooth, smoothing, chaikin" ---
- -

diff --git a/examples/chaikin.js b/examples/chaikin.js index 4d5f49f528..e155020356 100644 --- a/examples/chaikin.js +++ b/examples/chaikin.js @@ -36,39 +36,21 @@ const map = new Map({ }) }); -const typeSelect = document.getElementById('type'); const shallSmoothen = document.getElementById('shall-smoothen'); const numIterations = document.getElementById('iterations'); -let draw; // global so we can remove it later -function addInteraction() { - const value = typeSelect.value; - if (value !== 'None') { - draw = new Draw({ - source: vectorSource, - type: typeSelect.value - }); - map.addInteraction(draw); - draw.on('drawend', function(event) { - const feat = event.feature; - const geometry = feat.getGeometry(); - const isPoly = geometry.getType() === 'Polygon'; - const isLine = geometry.getType() === 'LineString'; - if (shallSmoothen.checked && (isPoly || isLine)) { - const coords = geometry.getCoordinates(); - const smoothened = makeSmooth(isPoly ? coords[0] : coords, parseInt(numIterations.value, 10) || 5); - geometry.setCoordinates(isPoly ? [smoothened] : smoothened); - } - }); +const draw = new Draw({ + source: vectorSource, + type: 'LineString' +}); +map.addInteraction(draw); +draw.on('drawend', function(event) { + if (!shallSmoothen.checked) { + return; } -} - -/** - * Handle change event. - */ -typeSelect.onchange = function() { - map.removeInteraction(draw); - addInteraction(); -}; - -addInteraction(); + const feat = event.feature; + const geometry = feat.getGeometry(); + const coords = geometry.getCoordinates(); + const smoothened = makeSmooth(coords, parseInt(numIterations.value, 10) || 5); + geometry.setCoordinates(smoothened); +});