@@ -174,7 +174,7 @@ addCanvas(
174174 at either of the points.` ;
175175 } ,
176176 ( ctx , width , height , animate ) => {
177- const angleRange = 30 ;
177+ const angleRange = 20 ;
178178 const lengthRange = 40 ;
179179 const period = 5000 ;
180180
@@ -213,34 +213,33 @@ addCanvas(
213213 const a = wobbleHandle (
214214 frameTime ,
215215 period / 2 + ( ra * period ) / 2 ,
216- point ( width * 0.5 , height * 0.3 , 230 , 150 , - 50 , 150 ) ,
216+ point ( width * 0.5 , height * 0.3 , 210 , 100 , - 30 , 100 ) ,
217217 false ,
218218 ) ;
219219 const b = wobbleHandle (
220220 frameTime ,
221221 period / 2 + ( rb * period ) / 2 ,
222- point ( width * 0.8 , height * 0.5 , - 90 , 100 , 90 , 100 ) ,
222+ point ( width * 0.8 , height * 0.5 , - 90 , 150 , 90 , 150 ) ,
223223 true ,
224224 ) ;
225225 const c = wobbleHandle (
226226 frameTime ,
227227 period / 2 + ( rc * period ) / 2 ,
228- point ( width * 0.5 , height * 0.9 , - 40 , 150 , - 140 , 150 ) ,
228+ point ( width * 0.5 , height * 0.9 , - 30 , 75 , - 150 , 75 ) ,
229229 false ,
230230 ) ;
231231 const d = wobbleHandle (
232232 frameTime ,
233233 period / 2 + ( rd * period ) / 2 ,
234- point ( width * 0.2 , height * 0.5 , 90 , 100 , - 90 , 100 ) ,
234+ point ( width * 0.2 , height * 0.5 , 90 , 150 , - 90 , 150 ) ,
235235 true ,
236236 ) ;
237237
238238 drawClosed ( ctx , [ a , b , c , d ] , true ) ;
239239 } ) ;
240240
241- return `Chaining curves together creates closed shapes. When the handles coming in and
242- out of a point are directly opposite the transition is smooth. Otherwise the shape will
243- have parts that look like spikes (either pointing in or out).` ;
241+ return `Chaining curves together creates closed shapes. When the in/out handles of a point
242+ form a line, the transition is smooth, and the curve is tangent to the line.` ;
244243 } ,
245244) ;
246245
0 commit comments