Difference between revisions of "W2261 Paths"

From Coder Merlin
(Created page with "== Complex Shapes == Arbitrarily complex shapes may be constructed using '''Path'''s. Paths are built of primitives enabling us to add straight lines or curves and then final...")
 
Line 1: Line 1:
== Complex Shapes ==
== Complex Shapes ==
Arbitrarily complex shapes may be constructed using '''Path'''s.  Paths are built of primitives enabling us to add straight lines or curves and then finally rendering the path by stroking or filling.
Arbitrarily complex shapes may be constructed using '''Path'''s.  Paths are built of primitives enabling us to add straight lines or curves and then finally rendering the path by stroking or filling.
{{Hint|Practice the below using the [http://www.codermerlin.com/users/daemon-igis/dyn/demos/path/index.html Igis Path Demo]}}


=== Adding Straight Lines ===
=== Adding Straight Lines ===
* To add a series of lines, we have two options:
* To add a series of points forming lines, we have two options:
** To ''move to'' a new position ''without'' drawing a line, we use the '''moveTo()''' method on a path.
** To ''move to'' a new position ''without'' drawing a line, we use the '''moveTo()''' method on a path.
** To draw a ''line to'' a new position ''continuing'' from the previous position, we use the '''lineTo()''' method on a path.
** To draw a ''line to'' a new position ''continuing'' from the previous position, we use the '''lineTo()''' method on a path.

Revision as of 12:02, 11 June 2019

Within these castle walls be forged Mavens of Computer Science ...
— Merlin, The Coder

Complex Shapes[edit]

Arbitrarily complex shapes may be constructed using Paths. Paths are built of primitives enabling us to add straight lines or curves and then finally rendering the path by stroking or filling.

Hint.pngHelpful Hint
Practice the below using the Igis Path Demo

Adding Straight Lines[edit]

  • To add a series of points forming lines, we have two options:
    • To move to a new position without drawing a line, we use the moveTo() method on a path.
    • To draw a line to a new position continuing from the previous position, we use the lineTo() method on a path.