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

Add an example showing Chaikins smoothing algorithm

Browse Source
This commit is contained in:
Marc Jansen
2018-03-20 15:06:28 +01:00
parent 93f704fcd5
commit d42de41af3
3 changed files with 101 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
examples/chaikin.html Normal file
View File

@@ -0,0 +1,26 @@
---
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
implements [Chaikins algorithm](http://graphics.cs.ucdavis.edu/education/CAGDNotes/Chaikins-Algorithm/Chaikins-Algorithm.html)
to smooth drawn lines.
Start by drawing on the map. Once you finish a drawing, the feature's geometry will be smoothed
as configured via the form elements.
tags: "smooth, smoothing, chaikin"
---
<div id="map" class="map"></div>
<form class="form-inline">
<label for="type">Geometry type &nbsp;</label>
<select id="type">
<option value="LineString">LineString</option>
<!-- Right now the package only supports lines, not closed rings -->
<!-- <option value="Polygon">Polygon</option> -->
</select><br>
<label for="shall-smoothen">Smooth drawn geometry?</label>
<input id="shall-smoothen" type="checkbox" checked><br>
<label for="iterations">Number of smoothings</label>
<input style="width: 250px;" type="range" id="iterations" min="2" max="10" step="1" value="5">
</form>