Stroke tab


Stroke tab

Attributes of Stroke


Stroke tab

Fill and Stroke constitute objects created with Namo WebCanvas, such as objects, shapes, texts, and paths. Fill and Stroke have their own specific paint attributes. Stroke has additional attributes, such as Width, Caps, Miter Limit, and Miter.

Examples of various Strokes
Namo WebCanvas basic property stroke Stroke tab

Attributes of Stroke tab

You can specify the width, type of the starting/ending point, shape of the corner of the Stroke.

Namo WebCanvas property storke Stroke tab

  • Width
    Specifies the width of the stroke in pixels.
  • Caps
    Specifies the type of the starting/ending point.
  • Namo WebCanvas icon window property stroke cap butt Stroke tab

    Butt Linecap
    The cut end of the stroke line is the ending point of the open path.

    Namo WebCanvas icon window property stroke cap round Stroke tab

    Round Linecap
    The cut end of the stroke line is rendered round.

    Namo WebCanvas icon window property stroke cap projecting Stroke tab

    Square Linecap
    The cut end of the stroke line gets projected by the width.

     

    Examples of various Linecaps
    Namo WebCanvas basic property stroke 3 Stroke tab

  • Miter Limit
    Specified in pixels. This option is activated only when the Miter Linejoin is selected.
  • Linejoin
    Specifies the shape of the stroke path corners.
  • Namo WebCanvas icon window property stroke miter miter Stroke tab

    Miter Linejoin
    Renders the corner miter-shaped. You can adjust the angle of the miter by modifying the values in Miter Limit.

    Namo WebCanvas icon window property stroke miter bevel Stroke tab

    Bevel Linejoin
    Renders the corner bevel-shaped.

    Namo WebCanvas icon window property stroke miter round Stroke tab

    Round Linejoin
    Renders the corner round.

     

    Example) Various corner (Linejoin) shapes
    Namo WebCanvas basic property stroke 4 Stroke tab

  • Start / End drop-down list
  • Specifies the type of arrow on the starting/ending point of the path. You can choose the shape of the arrow tip from the first Start/End drop-down list. Choose the size from the second Start/End drop-down menu list.

  • Dash
    Modifies the shape of the path from a solid to dotted line by choosing the line style from the drop-down menu list.
  • Namo WebCanvas basic property paint stroke 1 Stroke tab

    Solid Line

    Namo WebCanvas basic property paint stroke 2 Stroke tab

    Dot Line

    Namo WebCanvas basic property paint stroke 3 Stroke tab

    Short Dash Line

    Namo WebCanvas basic property paint stroke 4 Stroke tab

    Dash Line

    Namo WebCanvas basic property paint stroke 5 Stroke tab

    Dash Dot Line

    Namo WebCanvas basic property paint stroke 6 Stroke tab

    Dash Dot Dot Line

    Namo WebCanvas basic property paint stroke 7 Stroke tab

    Long Dash Line

    Namo WebCanvas basic property paint stroke 8 Stroke tab

    Long Dash Dot Line

    Namo WebCanvas basic property paint stroke 9 Stroke tab

    Long Dash Dot Dot Line

Namo WebCanvas top Stroke tab

Stroke tab