info/BezierInfo-2
1
0
Fork 0
mirror of https://github.com/Pomax/BezierInfo-2.git synced 2025-08-20 23:41:49 +02:00
Code Issues Releases Wiki Activity

fixed some stuffs

Browse Source
This commit is contained in:
Pomax
2016-01-14 10:21:11 -08:00
parent 419fe35edf
commit 07c0141f59
5 changed files with 56 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
components/sections/arclength/index.js
View File

@@ -164,9 +164,9 @@ var Arclength = React.createClass({
thus the better the approximation:</p>
<div className="figure">
<Graphic inline={true} preset="empty" title="A function's approximated integral" setup={this.setup} draw={this.drawCoarseIntegral}/>
<Graphic inline={true} preset="empty" title="A better approximation" setup={this.setup} draw={this.drawFineIntegral}/>
<Graphic inline={true} preset="empty" title="An even better approximation" setup={this.setup} draw={this.drawSuperFineIntegral}/>
<Graphic inline={true} static={true} preset="empty" title="A function's approximated integral" setup={this.setup} draw={this.drawCoarseIntegral}/>
<Graphic inline={true} static={true} preset="empty" title="A better approximation" setup={this.setup} draw={this.drawFineIntegral}/>
<Graphic inline={true} static={true} preset="empty" title="An even better approximation" setup={this.setup} draw={this.drawSuperFineIntegral}/>
</div>

16
components/sections/canonical/index.js
View File

@@ -13,6 +13,7 @@ var Canonical = React.createClass({
var curve = api.getDefaultCubic();
api.setCurve(curve);
api.reset();
api._map_loaded = false;
},
draw: function(api, curve) {
@@ -29,7 +30,15 @@ var Canonical = React.createClass({
api.drawCurve(curve);
api.offset.x += 400;
api.image(this.mapImage);
if (api._map_loaded) { api.image(api._map_image); }
else { setTimeout((
function() {
this.drawBase(api, curve);
this.draw(api, curve);
}
).bind(this), 100); }
api.drawLine({x:0,y:0}, {x:0, y:h});
var npts = [
@@ -62,6 +71,8 @@ var Canonical = React.createClass({
},
drawBase: function(api, curve) {
api.reset();
var w = 400,
h = w,
unit = this.unit = w/5,
@@ -152,7 +163,8 @@ var Canonical = React.createClass({
api.text("← Plain curve ↕", {x:w/2 + unit/2, y: h/6});
api.text("↕ Double inflection", {x:10, y: h/2 - 10});
this.mapImage = api.toImage();
api._map_image = api.toImage();
api._map_loaded = true;
},

18
components/sections/polybezier/index.js
View File

@@ -84,8 +84,11 @@ var PolyBezier = React.createClass({
if (api.mp) {
var quad = api.lpts.length === 8;
var i = api.mp_idx;
if (quad && i%2 !== 0) { this.movePointsQuadraticLD(api, i); }
else if(i%3 !== 0) { this.movePointsCubicLD(api, i); }
if (quad) {
if (i%2 !== 0) { this.movePointsQuadraticLD(api, i); }
} else {
if(i%3 !== 0) { this.movePointsCubicLD(api, i); }
}
}
},
@@ -139,8 +142,11 @@ var PolyBezier = React.createClass({
if (api.mp) {
var quad = api.lpts.length === 8;
var i = api.mp_idx;
if (quad && i%2 !== 0) { this.movePointsQuadraticDirOnly(api, i); }
else if(i%3 !== 0) { this.movePointsCubicDirOnly(api, i); }
if (quad) {
if(i%2 !== 0) { this.movePointsQuadraticDirOnly(api, i); }
} else {
if(i%3 !== 0) { this.movePointsCubicDirOnly(api, i); }
}
}
},
@@ -258,8 +264,8 @@ var PolyBezier = React.createClass({
of the next segment. This leads to poly-Béziers that are pretty hard to work with, but they're
the easiest to implement:</p>
<Graphic preset="poly" title="Loosely connected quadratic poly-Bézier" setup={this.setupQuadratic} draw={this.draw}/>
<Graphic preset="poly" title="Loosely connected cubic poly-Bézier" setup={this.setupCubic} draw={this.draw}/>
<Graphic preset="poly" title="Unlinked quadratic poly-Bézier" setup={this.setupQuadratic} draw={this.draw}/>
<Graphic preset="poly" title="Unlinked cubic poly-Bézier" setup={this.setupCubic} draw={this.draw}/>
<p>Dragging the control points around only affects the curve segments that the control point belongs
to, and moving an on-curve point leaves the control points where they are, which is not the most useful