Skip to content
UI5 SVGImage control to embed svg image
Branch: master
Clone or download
Latest commit 8e89f10 May 7, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
control added breadcrumg Dec 24, 2016
demo readme corrections Jan 13, 2017
.gitignore upd from webstorm Dec 18, 2016
.project.json added href github Jan 13, 2017
.user.project.json added href github Jan 13, 2017
Gruntfile.js initial commit Dec 18, 2016
LICENSE Initial commit Dec 18, 2016
README.md Update README.md May 7, 2018
bower.json upd from webstorm Dec 18, 2016
neo-app.json fix Dec 23, 2016
package.json initial commit Dec 18, 2016
ui5.control.SVGImage.png readme corrections Jan 13, 2017

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.

You can’t perform that action at this time.