View Source InlineSVG (inline_svg v0.1.2)
Render inline SVG.
initialization
Initialization
def SVGHelper do
use InlineSVG, root: "assets/static/svg", default_collection: "generic"
end
This will generate functions for each SVG file, effectively caching them at compile time.
usage
Usage
render-svg-from-default-collection
render SVG from default collection
svg("home")
It will load the SVG file from assets/static/svg/generic/home.svg
:
<svg>...</svg>
render-svg-from-other-collections
render SVG from other collections
You can break up SVG files into collections, and use the second argument of
svg/2
to specify the name of collection:
svg("user", "fontawesome")
It will load the SVG file from assets/static/svg/fontawesome/user.svg
:
<svg>...</svg>
render-svg-with-custom-html-attributes
render SVG with custom HTML attributes
You can also pass optional HTML attributes into the function to set those attributes on the SVG:
svg("home", class: "logo", id: "bounce-animation")
svg("home", "fontawesome", class: "logo", id: "bounce-animation")
It will output:
<svg class="logo" id="bounce-animation">...</svg>
<svg class="logo" id="bounce-animation">...</svg>
options
Options
There are several configuration options for meeting your needs.
root
:root
Specify the directory from which to load SVG files.
You must specify it by your own.
function_prefix
:function_prefix
Specify the prefix of functions.
By the default, the value is ""
. The generated function name is svg
.
If this value is "_". Then generated function name is _svg
.
default_collection
:default_collection
Specify the default collection to use.
The deafult value is generic
.
use-in-phoenix
Use in Phoenix
An example:
def DemoWeb.SVGHelper do
use InlineSVG,
root: "assets/static/svg",
function_prefix: "_",
default_collection: "generic"
def svg(arg1) do
Phoenix.HTML.raw(_svg(arg1))
end
def svg(arg1, arg2) do
Phoenix.HTML.raw(_svg(arg1, arg2))
end
def svg(arg1, arg2, arg3) do
Phoenix.HTML.raw(_svg(arg1, arg2, arg3))
end
end
Link to this section Summary
Functions
The macro precompiles the SVG files into functions.
Link to this section Functions
The macro precompiles the SVG files into functions.