UI5 SVGImage control to embed svg image
JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
control
demo
.gitignore
.project.json
.user.project.json
Gruntfile.js
LICENSE
README.md
bower.json
neo-app.json
package.json
ui5.control.SVGImage.png

README.md

SVGImage

OpenUI5 Developer Blog

UI5 control to inline referenced svg files by replacing DOM image with embedded SVG object.

Online Demo (SAP HCP)

Screenshot

Initialize

With JavaScript

new ui5.control.SVGImage({
	src : "{svg/OpenUI5.inline.svg}"
});

With XMLView

Add a data-masonry attribute to your element. Options can be set in JSON in the value.

xmlns:uc="ui5.control"
...
<uc:SVGImage src="svg/OpenUI5.inline.svg" />

With Prototyp

sap.ui.define([
	"sap/ui/core/mvc/Controller",
	"ui5/control/SVGPrototype"

The demo showcases two different flavours. First it includes the control to show the general usage. Second it includes a prototype which adds image functionality to existing sap.m controls to allow usage of SVG inline images without further actions (see demo).

License

SVGImage is released under the MIT license. Have at it.