The Perl Toolchain Summit needs more sponsors. If your company depends on Perl, please support this very important event.
DRSTEVE / stylehouse-20140427 / public / src / examples / Paperjs.org / Simplify.html 
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Simplify</title>
	<link rel="stylesheet" href="../css/style.css">
	<script type="text/javascript" src="../../dist/paper-full.js"></script>
	<script type="text/paperscript" canvas="canvas">
		var path;

		var textItem = new PointText({
			content: 'Click and drag to draw a line.',
			point: new Point(20, 30),
			fillColor: 'black',
		});

		function onMouseDown(event) {
			// If we produced a path before, deselect it:
			if (path) {
				path.selected = false;
			}

			// Create a new path and set its stroke color to black:
			path = new Path({
				segments: [event.point],
				strokeColor: 'black',
				// Select the path, so we can see its segment points:
				fullySelected: true
			});
		}

		// While the user drags the mouse, points are added to the path
		// at the position of the mouse:
		function onMouseDrag(event) {
			path.add(event.point);

			// Update the content of the text item to show how many
			// segments it has:
			textItem.content = 'Segment count: ' + path.segments.length;
		}

		// When the mouse is released, we simplify the path:
		function onMouseUp(event) {
			var segmentCount = path.segments.length;

			// When the mouse is released, simplify it:
			path.simplify(10);

			// Select the path, so we can see its segments:
			path.fullySelected = true;

			var newSegmentCount = path.segments.length;
			var difference = segmentCount - newSegmentCount;
			var percentage = 100 - Math.round(newSegmentCount / segmentCount * 100);
			textItem.content = difference + ' of the ' + segmentCount + ' segments were removed. Saving ' + percentage + '%';

		}
	</script>
</head>
<body>
	<canvas id="canvas" resize></canvas>
</body>
</html>