|
2 | 2 |
|
3 | 3 | Bezier curves are used in computer graphics to draw shapes, for CSS animation and in many other places.
|
4 | 4 |
|
5 |
| -They are actually a very simple thing, worth to study once and then feel comfortable in the world of vector graphics and advanced animations. |
| 5 | +They are a very simple thing, worth to study once and then feel comfortable in the world of vector graphics and advanced animations. |
6 | 6 |
|
7 | 7 | ## Control points
|
8 | 8 |
|
@@ -130,14 +130,14 @@ A non-smooth Bezier curve (yeah, that's possible too):
|
130 | 130 | [iframe src="demo.svg?p=0,0,1,1,0,1,1,0&animate=1" height=370]
|
131 | 131 |
|
132 | 132 | ```online
|
133 |
| -If there's anything unclear in the algorithm description, then live examples above show how |
| 133 | +If there's something unclear in the algorithm description, please look at the live examples above to see how |
134 | 134 | the curve is built.
|
135 | 135 | ```
|
136 | 136 |
|
137 | 137 | As the algorithm is recursive, we can build Bezier curves of any order, that is: using 5, 6 or more control points. But in practice many points are less useful. Usually we take 2-3 points, and for complex lines glue several curves together. That's simpler to develop and calculate.
|
138 | 138 |
|
139 | 139 | ```smart header="How to draw a curve *through* given points?"
|
140 |
| -We use control points for a Bezier curve. As we can see, they are not on the curve, except the first and the last ones. |
| 140 | +To specify a Bezier curve, control points are used. As we can see, they are not on the curve, except the first and the last ones. |
141 | 141 |
|
142 | 142 | Sometimes we have another task: to draw a curve *through several points*, so that all of them are on a single smooth curve. That task is called [interpolation](https://en.wikipedia.org/wiki/Interpolation), and here we don't cover it.
|
143 | 143 |
|
@@ -186,12 +186,12 @@ Bezier curves are defined by their control points.
|
186 | 186 |
|
187 | 187 | We saw two definitions of Bezier curves:
|
188 | 188 |
|
189 |
| -1. Using a mathematical formulas. |
190 |
| -2. Using a drawing process: De Casteljau's algorithm |
| 189 | +1. Using a drawing process: De Casteljau's algorithm. |
| 190 | +2. Using a mathematical formulas. |
191 | 191 |
|
192 | 192 | Good properties of Bezier curves:
|
193 | 193 |
|
194 |
| -- We can draw smooth lines with a mouse by moving around control points. |
| 194 | +- We can draw smooth lines with a mouse by moving control points. |
195 | 195 | - Complex shapes can be made of several Bezier curves.
|
196 | 196 |
|
197 | 197 | Usage:
|
|
0 commit comments