elm-community / typed-svg / TypedSvg.Core

SVG Nodes


type alias Svg msg =
VirtualDom.Node msg

The core building block to create SVG. This library is filled with helper functions to create these Svg values.

text : String -> Svg msg

A simple text node, no tags at all. Warning: not to be confused with text_ which produces the SVG <text> tag!

node : String -> List (Attribute msg) -> List (Svg msg) -> Svg msg

Create any SVG node. To create a <rect> helper function, you would write: rect : List (Attribute msg) -> List (Svg msg) -> Svg msg rect attributes children = node "rect" attributes children You should always be able to use the helper functions already defined in this library though!

map : (a -> msg) -> Svg a -> Svg msg

Transform the messages produced by some Svg.

foreignObject : List (Attribute msg) -> List (Html msg) -> Svg msg

The foreignObject SVG element allows for inclusion of a foreign XML namespace which has its graphical content drawn by a different user agent. The included foreign graphical content is subject to SVG transformations and compositing.

The contents of foreignObject are assumed to be from a different namespace. Any SVG elements within a foreignObject will not be drawn, except in the situation where a properly defined SVG subdocument with a proper xmlns attribute specification is embedded recursively. One situation where this can occur is when an SVG document fragment is embedded within another non-SVG document fragment, which in turn is embedded within an SVG document fragment (e.g., an SVG document fragment contains an XHTML document fragment which in turn contains yet another SVG document fragment).

Usually, a foreignObject will be used in conjunction with the switch element and the requiredExtensions attribute to provide proper checking for user agent support and provide an alternate rendering in case user agent support is not available.

SVG Attributes


type alias Attribute msg =
VirtualDom.Attribute msg

Set attributes on your Svg.

attribute : String -> String -> Attribute msg

Creates any untyped attribute

attributeNS : String -> String -> String -> Attribute msg

Creates any untyped, namespaced attribute

svgNamespace : Attribute msg