info/BezierInfo-2
1
0
Fork 0
mirror of https://github.com/Pomax/BezierInfo-2.git synced 2025-08-18 14:31:24 +02:00
Code Issues Releases Wiki Activity

yeaaah

Browse Source
This commit is contained in:
Pomax
2016-01-06 23:13:38 -08:00
parent c8c6a3504c
commit 4f3c475691
2 changed files with 18 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
article.js
View File

@@ -31092,6 +31092,11 @@
} }
}, },
onClickWithRedraw: function onClickWithRedraw(evt, api) {
this.onClick(evt, api);
api.redraw();
},
onClick: function onClick(evt, api) { onClick: function onClick(evt, api) {
api.t = api.curve.on({ x: evt.offsetX, y: evt.offsetY }, 7); api.t = api.curve.on({ x: evt.offsetX, y: evt.offsetY }, 7);
if (api.t < 0.05 || api.t > 0.95) api.t = false; if (api.t < 0.05 || api.t > 0.95) api.t = false;
@@ -31297,8 +31302,10 @@
React.createElement( React.createElement(
"div", "div",
{ className: "figure" }, { className: "figure" },
React.createElement(Graphic, { inline: true, preset: "abc", title: "Projections in a quadratic Bézier curve", setup: this.setupQuadratic, draw: this.draw, onClick: this.onClick }), React.createElement(Graphic, { inline: true, preset: "abc", title: "Projections in a quadratic Bézier curve",
React.createElement(Graphic, { inline: true, preset: "abc", title: "Projections in a cubic Bézier curve", setup: this.setupCubic, draw: this.draw, onClick: this.onClick }) setup: this.setupQuadratic, draw: this.draw, onClick: this.onClickWithRedraw }),
React.createElement(Graphic, { inline: true, preset: "abc", title: "Projections in a cubic Bézier curve",
setup: this.setupCubic, draw: this.draw, onClick: this.onClickWithRedraw })
), ),
React.createElement( React.createElement(
"p", "p",

11
components/sections/moulding/index.js
View File

@@ -74,6 +74,11 @@ var Moulding = React.createClass({
} }
}, },
onClickWithRedraw: function(evt, api) {
this.onClick(evt, api);
api.redraw();
},
onClick: function(evt, api) { onClick: function(evt, api) {
api.t = api.curve.on({x: evt.offsetX, y: evt.offsetY},7); api.t = api.curve.on({x: evt.offsetX, y: evt.offsetY},7);
if (api.t < 0.05 || api.t > 0.95) api.t = false; if (api.t < 0.05 || api.t > 0.95) api.t = false;
@@ -241,8 +246,10 @@ var Moulding = React.createClass({
Note the "ratio" value when you do so: does it change?):</p> Note the "ratio" value when you do so: does it change?):</p>
<div className="figure"> <div className="figure">
<Graphic inline={true} preset="abc" title="Projections in a quadratic Bézier curve" setup={this.setupQuadratic} draw={this.draw} onClick={this.onClick}/> <Graphic inline={true} preset="abc" title="Projections in a quadratic Bézier curve"
<Graphic inline={true} preset="abc" title="Projections in a cubic Bézier curve" setup={this.setupCubic} draw={this.draw} onClick={this.onClick}/> setup={this.setupQuadratic} draw={this.draw} onClick={this.onClickWithRedraw} />
<Graphic inline={true} preset="abc" title="Projections in a cubic Bézier curve"
setup={this.setupCubic} draw={this.draw} onClick={this.onClickWithRedraw} />
</div> </div>
<p>So, what exactly do we see in these graphics? First off, there's the three points <i>A</i>, <i>B</i> and <i>C</i>.</p> <p>So, what exactly do we see in these graphics? First off, there's the three points <i>A</i>, <i>B</i> and <i>C</i>.</p>