magic4

2024-12-03 16:40:54 +08:00
parent 6e6dd6a4fc
commit 9d776c65e9
408 changed files with 498647 additions and 99 deletions
--- a/static/Magic4/paperjs-v0.12.15/examples/Paperjs.org/Simplify.html
+++ b/static/Magic4/paperjs-v0.12.15/examples/Paperjs.org/Simplify.html
@@ -0,0 +1,63 @@
+<!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>