info/BezierInfo-2
1
0
Fork 0
mirror of https://github.com/Pomax/BezierInfo-2.git synced 2025-09-01 12:23:19 +02:00
Code Issues Releases Wiki Activity

fixed curvature

Browse Source
This commit is contained in:
Pomax
2020-09-25 16:02:29 -07:00
parent 4778f9a689
commit 8caa51813a
17 changed files with 8080 additions and 20419 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
docs/chapters/control/content.en-GB.md
View File

@@ -5,17 +5,15 @@ Bézier curves are, like all "splines", interpolation functions. This means that
The following graphs show the interpolation functions for quadratic and cubic curves, with "S" being the strength of a point's contribution to the total sum of the Bézier function. Click-and-drag to see the interpolation percentages for each curve-defining point at a specific <i>t</i> value.
<div class="figure">
<graphics-element title="Quadratic interpolations" src="./lerp.js" data-degree="3">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="Cubic interpolations" src="./lerp.js" data-degree="4">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="15th degree interpolations" src="./lerp.js" data-degree="15">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="Quadratic interpolations" src="./lerp.js" data-degree="3">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="Cubic interpolations" src="./lerp.js" data-degree="4">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="15th degree interpolations" src="./lerp.js" data-degree="15">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
</div>
Also shown is the interpolation function for a 15<sup>th</sup> order Bézier function. As you can see, the start and end point contribute considerably more to the curve's shape than any other point in the control point set.

20
docs/chapters/control/content.ja-JP.md
View File

@@ -5,17 +5,15 @@
下のグラフは、2次ベジエ曲線や3次ベジエ曲線の補間関数を表しています。ここでSは、ベジエ関数全体に対しての、その点の寄与の大きさを示します。ある<i>t</i>において、ベジエ曲線を定義する各点の補間率がどのようになっているのか、クリックドラッグをして確かめてみてください。
<div class="figure">
<graphics-element title="2次の補間" src="./lerp.js" data-degree="3">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="3次の補間" src="./lerp.js" data-degree="4">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="15次の補間" src="./lerp.js" data-degree="15">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="2次の補間" src="./lerp.js" data-degree="3">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="3次の補間" src="./lerp.js" data-degree="4">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="15次の補間" src="./lerp.js" data-degree="15">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
</div>
あわせて、15次ベジエ関数における補間関数も示しています。始点と終点は他の制御点と比較して、曲線の形に対してかなり大きな影響を与えていることがわかります。

20
docs/chapters/control/content.zh-CN.md
View File

@@ -5,17 +5,15 @@
下面的图形显示了二次曲线和三次曲线的差值方程，“S”代表了点对贝塞尔方程总和的贡献。点击拖动点来看看在特定的<i>t</i>值时，每个曲线定义的点的插值百分比。
<div class="figure">
<graphics-element title="二次插值" src="./lerp.js" data-degree="3">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="三次插值" src="./lerp.js" data-degree="4">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="15次插值" src="./lerp.js" data-degree="15">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="二次插值" src="./lerp.js" data-degree="3">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="三次插值" src="./lerp.js" data-degree="4">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
<graphics-element title="15次插值" src="./lerp.js" data-degree="15">
<input type="range" min="0" max="1" step="0.01" value="0" class="slide-control">
</graphics-element>
</div>
上面有一张是15<sup>th</sup>阶的插值方程。如你所见，在所有控制点中，起点和终点对曲线形状的贡献比其他点更大些。