JSFiddle - React, Tailwind, and code Playground

by Ryan Duffy

CSS

.SvgObject{
        width:200px;
        height:200px;
}

JavaScript

enyo.kind({
    name: "App",
    kind: enyo.Control,
    //fit: true,
    published: {
        source: ''
    },
    components: [{
        tag: 'object',
        name: 'svgObject',
        classes: 'SvgObject',
        handlers: {
            ontap: 'tapHandler',
            onload: 'loadHandler'
        }
        //ontap:'tapHandler' (same as above)
    }],
    rendered: function() {
        this.inherited(arguments);
        this.sourceChanged();
    },
    sourceChanged: function() {
        var svgObj = this.$.svgObject;
        if (svgObj.hasNode()) {

            svgObj.setAttribute("type", 'image/svg+xml');
            svgObj.setAttribute("data", this.source);
            console.log(svgObj.getAttribute("data"));
        }
    },

    loadHandler: function(inSender, inEvent) {
        console.log('loadedhandler');
    },
    tapHandler: function(inSender, inEvent) {
        console.log('klikhandler');
    }
});

new App({source:'https://raw.github.com/gist/4066186/babcfcd481ef5d0f5c2e9d421cd5b0449aee893f/simple.svg'}).renderInto(document.body);