Svg.PathD

PathD - Minimal SVG Path constructor of the d attribute.

This library helps you specify SVG paths with a clean Elm interface. For the complete instruction on what each segment does, consult the MDN docs on SVG: https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths

Example of drawing a custom shape:

import Svg.PathD exposing (Segment(..), d_)


...


Svg.path
    [ d_
        [ M (-0.5, 0.5)
        , Q (0.5, 0.5) (0.5, -0.5)
        , L (-0.5, -0.5)
        , Z
        ]
    ]
    []

Specifying a SVG Path

d_ : List Segment -> Attribute msg

Replaces Svg.Attributes.d. This function takes a list of Segments and produces a SVG d attribute with exact specifications.

type Segment

= M Point

| L Point

| H Float

| V Float

| Z

| C Point Point Point

| S Point Point

| Q Point Point

| T Point

| A Point Float Bool Bool Point

Complete implementation of the SVG path d attribute.

Helper methods

segment : Segment -> String

Converts a Segment to a partial SVG Path string

Data Type

type alias Point =

( Float, Float )

Type shorthand for 2 floats that make up a coordinate.

Modules

Svg.PathD

Spaxe/svg-pathd/1.0.0

Svg.PathD

Specifying a SVG Path

Helper methods

Data Type

Modules