Phlex.SVG (phlex v0.3.0)

Copy Markdown View Source

SVG component base for Phlex.

Use this module to create SVG components:

defmodule MyIcon do
  use Phlex.SVG

  def view_template(_assigns, state) do
    state
    |> svg([viewBox: "0 0 24 24"], fn state ->
      state
      |> circle([cx: "12", cy: "12", r: "10"])
    end)
  end
end

SVG components can be used within HTML components:

defmodule MyPage do
  use Phlex.HTML

  def view_template(_assigns, state) do
    state
    |> div([], fn state ->
      render_component(state, MyIcon)
    end)
  end
end

Summary

Functions

Outputs CDATA section.

Functions

a(state)

a(state, content_fun)

a(state, attrs, content_fun)

animate(state)

animate(state, content_fun)

animate(state, attrs, content_fun)

animateMotion(state)

animateMotion(state, content_fun)

animateMotion(state, attrs, content_fun)

animateTransform(state)

animateTransform(state, content_fun)

animateTransform(state, attrs, content_fun)

cdata(state, content)

Outputs CDATA section.

Examples

cdata(state, "<script>alert('test')</script>")

circle(state)

circle(state, content_fun)

circle(state, attrs, content_fun)

clipPath(state)

clipPath(state, content_fun)

clipPath(state, attrs, content_fun)

defs(state)

defs(state, content_fun)

defs(state, attrs, content_fun)

desc(state)

desc(state, content_fun)

desc(state, attrs, content_fun)

ellipse(state)

ellipse(state, content_fun)

ellipse(state, attrs, content_fun)

feBlend(state)

feBlend(state, content_fun)

feBlend(state, attrs, content_fun)

feColorMatrix(state)

feColorMatrix(state, content_fun)

feColorMatrix(state, attrs, content_fun)

feComposite(state)

feComposite(state, content_fun)

feComposite(state, attrs, content_fun)

feGaussianBlur(state)

feGaussianBlur(state, content_fun)

feGaussianBlur(state, attrs, content_fun)

feMerge(state)

feMerge(state, content_fun)

feMerge(state, attrs, content_fun)

feMergeNode(state)

feMergeNode(state, content_fun)

feMergeNode(state, attrs, content_fun)

feOffset(state)

feOffset(state, content_fun)

feOffset(state, attrs, content_fun)

filter(state)

filter(state, content_fun)

filter(state, attrs, content_fun)

g(state)

g(state, content_fun)

g(state, attrs, content_fun)

line(state)

line(state, content_fun)

line(state, attrs, content_fun)

linearGradient(state)

linearGradient(state, content_fun)

linearGradient(state, attrs, content_fun)

marker(state)

marker(state, content_fun)

marker(state, attrs, content_fun)

mask(state)

mask(state, content_fun)

mask(state, attrs, content_fun)

metadata(state)

metadata(state, content_fun)

metadata(state, attrs, content_fun)

path(state)

path(state, content_fun)

path(state, attrs, content_fun)

pattern(state)

pattern(state, content_fun)

pattern(state, attrs, content_fun)

polygon(state)

polygon(state, content_fun)

polygon(state, attrs, content_fun)

polyline(state)

polyline(state, content_fun)

polyline(state, attrs, content_fun)

radialGradient(state)

radialGradient(state, content_fun)

radialGradient(state, attrs, content_fun)

rect(state)

rect(state, content_fun)

rect(state, attrs, content_fun)

render_element(tag_name, attrs, state, content_fun \\ nil)

Renders a standard SVG element.

script(state)

script(state, content_fun)

script(state, attrs, content_fun)

set(state)

set(state, content_fun)

set(state, attrs, content_fun)

stop(state)

stop(state, content_fun)

stop(state, attrs, content_fun)

style(state)

style(state, content_fun)

style(state, attrs, content_fun)

svg(state)

svg(state, content_fun)

svg(state, attrs, content_fun)

symbol(state)

symbol(state, content_fun)

symbol(state, attrs, content_fun)

tag(tag_name, attrs, state, content_fun \\ nil)

Renders a dynamic SVG tag.

Examples

tag(:path, [d: "M 10 10 L 20 20"], state)

text(state)

text(state, content_fun)

text(state, attrs, content_fun)

title(state)

title(state, content_fun)

title(state, attrs, content_fun)

tspan(state)

tspan(state, content_fun)

tspan(state, attrs, content_fun)

use(state)

use(state, content_fun)

use(state, attrs, content_fun)