e9e2aec77d
git-svn-id: http://svn.openlayers.org/trunk/openlayers@10969 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
87 lines
3.8 KiB
HTML
87 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Simplify LineString</title>
|
|
<link rel="stylesheet" href="../theme/default/style.css" type="text/css">
|
|
<link rel="stylesheet" href="style.css" type="text/css">
|
|
<style type="text/css">
|
|
#map, #map-simplify {
|
|
height: 400px;
|
|
width: 400px;
|
|
margin: 5px !important;
|
|
float: left;
|
|
}
|
|
#info {
|
|
width: 300px;
|
|
float: left;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1 id="title">Simplify a LineString</h1>
|
|
<div id="tags">
|
|
Douglas-Peucker, Douglas, Peucker, Peuker, tolerance
|
|
</div>
|
|
<p id="shortdesc">
|
|
Shows the usage of the utility method "simplifyLineString" that
|
|
implements the Douglas-Peucker algorithm to remove "insignificant"
|
|
vertices from LineString geometries.
|
|
</p>
|
|
<div id="control-simplify">
|
|
<input name="tolerance" id="tolerance" type="number" min="0" max="1" step="0.02" value="0.1">
|
|
<input type="button" id="simplify" value="Simplify LineString">
|
|
<input type="button" id="animation" value="Start animation">
|
|
</div>
|
|
<div id="map" class="smallmap">
|
|
</div>
|
|
<div id="map-simplify" class="smallmap">
|
|
</div>
|
|
<div id="info">
|
|
</div>
|
|
<div id="docs" style="clear: both;">
|
|
<p>
|
|
The method OpenLayers.Util.simplifyLineString can be used to
|
|
simplify linestring geometries. Simplification sometimes is
|
|
useful to enhance the perfomance of vector rendering or to
|
|
reduce complexity of geometries. This might be especially handy
|
|
when viewing geometries a small scales.
|
|
</p>
|
|
<p>
|
|
OpenLayers.Util.simplifyLineString is a recursive implementation
|
|
of the famous Douglas-Peucker algorithm. It
|
|
is controlled by a tolerance factor that defines the threshold
|
|
for vertices to be considered "insignificant" for the general
|
|
structure of the geometry.
|
|
</p>
|
|
<p>
|
|
The LineString on the left map can be simplified according to
|
|
the tolerance value one enters in the form-field above the maps.
|
|
Use a value between 0 and 1 for best results. If you navigate
|
|
the left map, the right map will show the same location to make
|
|
it easier to spot the differeces between the LineStrings.
|
|
</p>
|
|
<p>
|
|
The LineString
|
|
represents a part of the coastline of
|
|
<a href="http://www.openstreetmap.org/?lat=54.7309684753418&lon=83.1809234619141&zoom=11">this
|
|
place in Russia</a> — found via <a href="http://ryba4.com/python/ramer-douglas-peucker">an
|
|
example implementation of the algorithm in python</a>.
|
|
</p>
|
|
<p>
|
|
For a detailled explanation of the algorithm see
|
|
<a href="http://en.wikipedia.org/wiki/Douglas-Peucker_algorithm">the
|
|
Wikipedia article</a> or the original publication: David Douglas
|
|
& Thomas Peucker, "Algorithms for the reduction of the
|
|
number of points required to represent a digitized line or its
|
|
caricature", The Canadian Cartographer 10(2), 112-122 (1973)
|
|
(<a href="http://dx.doi.org/10.3138/FM57-6770-U75U-7727">DOI:
|
|
10.3138/FM57-6770-U75U-7727</a>).
|
|
</p>
|
|
</div>
|
|
<script type="text/javascript" src="../lib/OpenLayers.js">
|
|
</script>
|
|
<script type="text/javascript" src="simplify-linestring.js">
|
|
</script>
|
|
</body>
|
|
</html>
|