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

[zh-CN] Added translation of chapter "components" (#360)

Browse Source 
* Added zh-CN translation of chapter "components"

* Update content.zh-CN.md

Co-authored-by: Pomax <pomax@nihongoresources.com>
This commit is contained in:
yarusome
2022-09-04 00:32:56 +08:00
committed by GitHub
parent ea5964b5e4
commit fd6a63e067
1 changed files with 13 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
docs/chapters/components/content.zh-CN.md Normal file
View File

@@ -0,0 +1,13 @@
# 分量函数
当人们开始在自己的程序中使用贝塞尔曲线时，首先遇到的问题之一是：“我虽然知道怎么画曲线，但是怎么确定包围盒？”其实做法颇为直接，但需要知道如何利用一些数学知识得到所需的值。对于包围盒而言，所需的其实并不是曲线本身，而只是曲线的“极值”——曲线的x轴和y轴分量的最小值和最大值。如果还记得微积分的话（前提是学过微积分，否则更难记），那么函数的极值可以用函数的一阶导数所确定，但由于“曲线函数”有不只一个分量，这就产生了一个问题——每个分量都有自己的函数。
解决办法：对每个分量分别计算导数，再按照原来的分量顺序重新拼在一起。
以下演示参数化的贝塞尔曲线如何“分解”为两个正常的函数，一个对应于x轴，一个对应于y轴。注意左侧的图像依然是可交互的曲线，但没有标出坐标轴（坐标显示在图中）；中间和右侧的图像是分量函数，分别对应于指定*t*值（介于0和1之间，含端点）后求出的x轴和y轴分量。
如果水平移动曲线上的点，那么应当只有中间的图像在变化；同样，如果竖直移动曲线上的点，那么应当只有右侧的图像在变化。
<graphics-element title="二次贝塞尔曲线的分量" width="825" src="./components.js" data-type="quadratic"></graphics-element>
<graphics-element title="三次贝塞尔曲线的分量" width="825" src="./components.js" data-type="cubic"></graphics-element>