UI Awesome HTML SVG Tag for PHP.

The svg element is a container that defines a new coordinate system and viewport.

It is used as the outermost element of SVG documents, but it can also be used to embed an SVG fragment inside an SVG or HTML document.

use UIAwesome\Html\Graphic\Svg;

echo Svg::widget()
    ->class('hidden')
    ->filePath(__DIR__ . '/svg/moon.svg')
    ->fill('currentColor')
    ->height(32)
    ->id('theme-toggle-dark-icon')
    ->width(32);

Installation

The preferred way to install this extension is through composer.

Either run

composer require --prefer-dist "ui-awesome/html-svg":"^0.1"

or add

"ui-awesome/html-svg": "^0.1"

to the require section of your composer.json file.

Usage

Instantiate the Svg class using Svg::widget().

$svg = Svg::widget();

Setting Attributes

Use the provided methods to set specific attributes for the a element.

// setting class attribute
$svg->class('container');

Or, use the attributes method to set multiple attributes at once.

$svg->attributes(['class' => 'container', 'style' => 'background-color: #eee;']);

Adding Content

If you want to include content within the svg tag, use the content method.

$svg->content('MyContent');

Rendering

Generate the HTML output using the render method, for simple instantiation.

$html = $svg->render();

Or, use the magic __toString method.

$html = (string) $svg;

Common Use Cases

Below are examples of common use cases:

// adding multiple attributes
$svg->class('external')->content('MyContent');

// setting the file path for the `HTML` output
$svg->filePath('/path/to/file')->render();

Explore additional methods for setting various attributes such as fill, heigth, lang, name, style, title, viewbox, width, xmlns, etc.

Attributes

Refer to the Attribute Tests for comprehensive examples.

The following methods are available for setting attributes:

Method	Description
attributes()	Set multiple attributes at once.
class()	Set the class attribute.
content()	Set the content within the svg element.
fill()	Set the fill attribute.
height()	Set the height attribute.
id()	Set the id attribute.
lang()	Set the lang attribute.
name()	Set the name attribute.
stroke()	Set the stroke attribute.
style()	Set the style attribute.
title()	Set the title attribute.
viewBox()	Set the viewBox attribute.
width()	Set the width attribute.
xmlns()	Set the xmlns attribute.

Custom methods

Refer to the Custom Methods Tests for comprehensive examples.

The following methods are available for customizing the HTML output:

Method	Description
filePath()	Set the file path for the HTML output.
render()	Generates the HTML output.
widget()	Instantiates the Svg::class.

Testing

Check the documentation testing to learn about testing.

Support versions

License

The MIT License (MIT). Please see License File for more information.

Our social networks