quad-curve-example.js

total 0
used 0
limit 0
/* --- title: Bezier Curve Example files: ../point_src/math.js head point pointlist dragging mouse stage dragging stroke ../point_src/curve-extras.js ../point_src/catenary-curve.js --- A demo of the `BezierCurve` instance. curve = new BezierCurve( new Point(200, 300, 200, -30) , new Point(600, 340, 200, 90) ) curve.render(ctx) */ class MainStage extends Stage { canvas='playspace' _tick = 0 mounted(){ this.curve = new CatenaryCurve( new Point(200, 300, 200, -30) , new Point(500, 340, 200, 90) , 700 ) this.dragging.add(...this.curve.points) } draw(ctx){ this.clear(ctx) this.curve.points.pen.indicator(ctx, {color: '#333', width:1}) // this.curve.updateSwing(ctx, this.tick++) this.curve.perform(ctx) this.curve.draw(ctx, {color: 'purple', width:2}) } } ;stage = MainStage.go();
Run
Meta Data
title Bezier Curve Example
imports ()
files ('../point_src/math.js', 'head', 'point', 'pointlist', 'dragging', 'mouse', 'stage', 'dragging', 'stroke', '../point_src/curve-extras.js', '../point_src/catenary-curve.js')
unused_keys ()
unknown_keys ()
filepath_exists True
path quad-curve-example.js
filepath quad-curve-example.js
clean_files ('../point_src/math.js', '../point_src/core/head.js', '../point_src/pointpen.js', '../point_src/compass.js', '../point_src/center.js', '../point_src/point-content.js', '../point_src/pointdraw.js', '../point_src/relative-xy.js', '../point_src/pointcast.js', '../point_src/point.js', '../point_src/pointlistdraw.js', '../point_src/pointlistgradient.js', '../point_src/pointlistshape.js', '../point_src/pointlistgenerator.js', '../point_src/unpack.js', '../point_src/pointlist.js', '../point_src/pointlistpen.js', '../point_src/functions/clamp.js', '../point_src/distances.js', '../point_src/protractor.js', '../point_src/text/beta.js', '../point_src/dragging.js', '../point_src/events.js', '../point_src/automouse.js', '../point_src/stage-hooks.js', '../point_src/stage-resize.js', '../point_src/functions/resolve.js', '../point_src/stage.js', '../point_src/setunset.js', '../point_src/stroke.js', '../point_src/curve-extras.js', '../point_src/catenary-curve.js')
markdown {'html': '<p>A demo of the <code>BezierCurve</code> instance.</p>\n<pre><code>curve = new BezierCurve(\n new Point(200, 300, 200, -30)\n , new Point(600, 340, 200, 90)\n )\ncurve.render(ctx)\n</code></pre>', 'content': '---\ntitle: Bezier Curve Example\nfiles:\n ../point_src/math.js\n head\n point\n pointlist\n dragging\n mouse\n stage\n dragging\n stroke\n ../point_src/curve-extras.js\n ../point_src/catenary-curve.js\n---\n\nA demo of the `BezierCurve` instance.\n\n curve = new BezierCurve(\n new Point(200, 300, 200, -30)\n , new Point(600, 340, 200, 90)\n )\n curve.render(ctx)'}