Add `style` element to SVGs

The ruleset returned by `Styleable::getStyle()` is added to the SVG.
This commit is contained in:
raviks789 2023-08-17 12:39:58 +02:00
parent 97a14d7b18
commit 282b4d564a
6 changed files with 107 additions and 18 deletions

View File

@ -4,6 +4,7 @@
namespace Icinga\Chart\Primitive;
use DOMDocument;
use DOMElement;
use Icinga\Chart\Render\RenderContext;
use Icinga\Chart\Format;
@ -61,8 +62,23 @@ class Circle extends Styleable implements Drawable
$circle->setAttribute('cx', Format::formatSVGNumber($coords[0]));
$circle->setAttribute('cy', Format::formatSVGNumber($coords[1]));
$circle->setAttribute('r', $this->radius);
$circle->setAttribute('style', $this->getStyle());
$id = $this->id ?? uniqid('circle-');
$circle->setAttribute('id', $id);
$this->setId($id);
$this->applyAttributes($circle);
$style = new DOMDocument();
$style->loadHTML($this->getStyle());
$circle->appendChild(
$circle->ownerDocument->importNode(
$style->getElementsByTagName('style')->item(0),
true
)
);
return $circle;
}
}

View File

@ -3,6 +3,7 @@
namespace Icinga\Chart\Primitive;
use DOMDocument;
use DOMElement;
use Icinga\Chart\Render\RenderContext;
use Icinga\Chart\Format;
@ -80,8 +81,23 @@ class Line extends Styleable implements Drawable
$line->setAttribute('x2', Format::formatSVGNumber($x2));
$line->setAttribute('y1', Format::formatSVGNumber($y1));
$line->setAttribute('y2', Format::formatSVGNumber($y2));
$line->setAttribute('style', $this->getStyle());
$id = $this->id ?? uniqid('line-');
$line->setAttribute('id', $id);
$this->setId($id);
$this->applyAttributes($line);
$style = new DOMDocument();
$style->loadHTML($this->getStyle());
$line->appendChild(
$line->ownerDocument->importNode(
$style->getElementsByTagName('style')->item(0),
true
)
);
return $line;
}
}

View File

@ -3,6 +3,7 @@
namespace Icinga\Chart\Primitive;
use DOMDocument;
use DOMElement;
use Icinga\Chart\Render\RenderContext;
use Icinga\Chart\Format;
@ -162,12 +163,24 @@ class Path extends Styleable implements Drawable
}
$path = $doc->createElement('path');
if ($this->id) {
$path->setAttribute('id', $this->id);
}
$id = $this->id ?? uniqid('path-');
$path->setAttribute('id', $id);
$this->setId($id);
$path->setAttribute('d', $pathDescription);
$path->setAttribute('style', $this->getStyle());
$this->applyAttributes($path);
$style = new DOMDocument();
$style->loadHTML($this->getStyle());
$path->appendChild(
$path->ownerDocument->importNode(
$style->getElementsByTagName('style')->item(0),
true
)
);
$group->appendChild($path);
return $group;
}

View File

@ -3,6 +3,7 @@
namespace Icinga\Chart\Primitive;
use DOMDocument;
use DOMElement;
use Icinga\Chart\Render\RenderContext;
use Icinga\Chart\Format;
@ -279,9 +280,22 @@ class PieSlice extends Animatable implements Drawable
$slicePath = $doc->createElement('path');
$slicePath->setAttribute('d', $this->getPieSlicePath($x, $y, $r));
$slicePath->setAttribute('style', $this->getStyle());
$slicePath->setAttribute('data-icinga-graph-type', 'pieslice');
$id = $this->id ?? uniqid('slice-');
$slicePath->setAttribute('id', $id);
$this->setId($id);
$style = new DOMDocument();
$style->loadHTML($this->getStyle());
$slicePath->appendChild(
$slicePath->ownerDocument->importNode(
$style->getElementsByTagName('style')->item(0),
true
)
);
$this->applyAttributes($slicePath);
$group->appendChild($slicePath);
if ($this->caption != "") {

View File

@ -4,6 +4,7 @@
namespace Icinga\Chart\Primitive;
use DOMElement;
use DOMDocument;
use Icinga\Chart\Render\RenderContext;
use Icinga\Chart\Format;
@ -95,11 +96,24 @@ class Rect extends Animatable implements Drawable
$rect->setAttribute('y', Format::formatSVGNumber($y));
$rect->setAttribute('width', Format::formatSVGNumber($width));
$rect->setAttribute('height', Format::formatSVGNumber($height));
$rect->setAttribute('style', $this->getStyle());
$id = $this->id ?? uniqid('rect-');
$rect->setAttribute('id', $id);
$this->setId($id);
$this->applyAttributes($rect);
$this->appendAnimation($rect, $ctx);
$style = new DOMDocument();
$style->loadHTML($this->getStyle());
$rect->appendChild(
$rect->ownerDocument->importNode(
$style->getElementsByTagName('style')->item(0),
true
)
);
return $rect;
}
}

View File

@ -4,10 +4,12 @@
namespace Icinga\Chart\Primitive;
use DOMDocument;
use DOMElement;
use DOMText;
use Icinga\Chart\Render\RenderContext;
use Icinga\Chart\Format;
use ipl\Html\HtmlDocument;
/**
* Wrapper for the SVG text element
@ -97,6 +99,15 @@ class Text extends Styleable implements Drawable
$this->y = $y;
$this->text = $text;
$this->fontSize = $fontSize;
$this->setAdditionalStyle([
'font-size' => $this->fontSize,
'font-family' => 'Ubuntu, Calibri, Trebuchet MS, Helvetica, Verdana, sans-serif',
'font-weight' => $this->fontWeight,
'font-stretch' => $this->fontStretch,
'font-style' => 'normal',
'text-anchor' => $this->alignment
]);
}
/**
@ -150,19 +161,24 @@ class Text extends Styleable implements Drawable
list($x, $y) = $ctx->toAbsolute($this->x, $this->y);
$text = $ctx->getDocument()->createElement('text');
$text->setAttribute('x', Format::formatSVGNumber($x - 15));
$text->setAttribute(
'style',
$this->getStyle()
. ';font-size:' . $this->fontSize
. '; font-family: Ubuntu, Calibri, Trebuchet MS, Helvetica, Verdana, sans-serif'
. ';font-weight: ' . $this->fontWeight
. ';font-stretch: ' . $this->fontStretch
. '; font-style: normal;'
. 'text-anchor: ' . $this->alignment
);
$id = $this->id ?? uniqid('text-');
$text->setAttribute('id', $id);
$this->setId($id);
$text->setAttribute('y', Format::formatSVGNumber($y));
$text->appendChild(new DOMText($this->text));
$style = new DOMDocument();
$style->loadHTML($this->getStyle());
$text->appendChild(
$text->ownerDocument->importNode(
$style->getElementsByTagName('style')->item(0),
true
)
);
return $text;
}
}