_OLD/uil-1.0/build/uil.module.js
function( canvas, content, w, h ){

        var ctx = canvas.getContext("2d");

        var dcopy = null;

        if( typeof content === 'string' ){

            dcopy = Tools.dom( 'iframe', 'position:abolute; left:0; top:0; width:'+w+'px; height:'+h+'px;' );
            dcopy.src = content;

        }else{
            dcopy = content.cloneNode(true);
            dcopy.style.left = 0;
        }

        var svg = Tools.dom( 'foreignObject', 'position:abolute; left:0; top:0;', { width:w, height:h });

        svg.childNodes[0].appendChild( dcopy );
        
        svg.setAttribute("version", "1.1");
        svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg' );
        svg.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink");

        svg.setAttribute('width', w );
        svg.setAttribute('height', h );
        svg.childNodes[0].setAttribute('width', '100%' );
        svg.childNodes[0].setAttribute('height', '100%' );

        //console.log(svg)

        var img = new Image();
        

        var data = 'data:image/svg+xml;base64,'+ window.btoa((new XMLSerializer).serializeToString(svg));
        dcopy = null;

        img.onload = function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
        };
        
        img.src = data;

        /*setTimeout(function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
        }, 0);*/

        // blob

        /*var svgBlob = new Blob([(new XMLSerializer).serializeToString(svg)], {type: "image/svg+xml;charset=utf-8"});
        var url = URL.createObjectURL(svgBlob);

        img.onload = function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
            URL.revokeObjectURL(url);
        };
        img.src = url;*/

    }
function( canvas, content, w, h ){

        var ctx = canvas.getContext("2d");

        var dcopy = null;

        if( typeof content === 'string' ){

            dcopy = Tools.dom( 'iframe', 'position:abolute; left:0; top:0; width:'+w+'px; height:'+h+'px;' );
            dcopy.src = content;

        }else{
            dcopy = content.cloneNode(true);
            dcopy.style.left = 0;
        }

        var svg = Tools.dom( 'foreignObject', 'position:abolute; left:0; top:0;', { width:w, height:h });

        svg.childNodes[0].appendChild( dcopy );
        
        svg.setAttribute("version", "1.1");
        svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg' );
        svg.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink");

        svg.setAttribute('width', w );
        svg.setAttribute('height', h );
        svg.childNodes[0].setAttribute('width', '100%' );
        svg.childNodes[0].setAttribute('height', '100%' );

        //console.log(svg)

        var img = new Image();
        

        var data = 'data:image/svg+xml;base64,'+ window.btoa((new XMLSerializer).serializeToString(svg));
        dcopy = null;

        img.onload = function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
        };
        
        img.src = data;

        /*setTimeout(function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
        }, 0);*/

        // blob

        /*var svgBlob = new Blob([(new XMLSerializer).serializeToString(svg)], {type: "image/svg+xml;charset=utf-8"});
        var url = URL.createObjectURL(svgBlob);

        img.onload = function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
            URL.revokeObjectURL(url);
        };
        img.src = url;*/

    }
function ( canvas , content , w , h ) { var ctx = canvas . getContext ( "2d" ) ; var dcopy = null ; if ( typeof content === 'string' ) { dcopy = Tools . dom ( 'iframe' , 'position:abolute; left:0; top:0; width:' + w + 'px; height:' + h + 'px;' ) ; dcopy . src = content ; } else { dcopy = content . cloneNode ( true ) ; dcopy . style . left = 0 ; } var svg = Tools . dom ( 'foreignObject' , 'position:abolute; left:0; top:0;' , { width : w , height : h } ) ; svg . childNodes [ 0 ] . appendChild ( dcopy ) ; svg . setAttribute ( "version" , "1.1" ) ; svg . setAttribute ( 'xmlns' , 'http://www.w3.org/2000/svg' ) ; svg . setAttribute ( "xmlns:xlink" , "http://www.w3.org/1999/xlink" ) ; svg . setAttribute ( 'width' , w ) ; svg . setAttribute ( 'height' , h ) ; svg . childNodes [ 0 ] . setAttribute ( 'width' , '100%' ) ; svg . childNodes [ 0 ] . setAttribute ( 'height' , '100%' ) ; //console.log(svg) var img = new Image ( ) ; var data = 'data:image/svg+xml;base64,' + window . btoa ( ( new XMLSerializer ) . serializeToString ( svg ) ) ; dcopy = null ; img . onload = function ( ) { ctx . clearRect ( 0 , 0 , w , h ) ; ctx . drawImage ( img , 0 , 0 , w , h , 0 , 0 , w , h ) ; } ; img . src = data ; /*setTimeout(function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
        }, 0);*/ // blob /*var svgBlob = new Blob([(new XMLSerializer).serializeToString(svg)], {type: "image/svg+xml;charset=utf-8"});
        var url = URL.createObjectURL(svgBlob);

        img.onload = function() {
            ctx.clearRect( 0, 0, w, h );
            ctx.drawImage( img, 0, 0, w, h, 0, 0, w, h );
            URL.revokeObjectURL(url);
        };
        img.src = url;*/ }
svg to canvas test
svg to canvas test