27 lines
1.2 KiB
HTML
27 lines
1.2 KiB
HTML
---
|
|
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 </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>
|