Versucht, ein SVG in PNG zu konvertieren Image

Question

Ich habe damit für ein bisschen zu tun, aber ich kann nicht scheinen es zu arbeiten. Ein Klick auf das resultierende PNG-Bild ist leer. Siehe Code unten ....

function svgToCanvas (targetElem,fileName) { 
    var nodesToRecover = []; 
    var nodesToRemove = []; 

    var svgElem = targetElem.find('svg'); 

    console.log(svgElem); 

    svgElem.each(function(index, node) { 
     var parentNode = node.parentNode; 
     var svg = parentNode.innerHTML; 

     var canvas = document.createElement('canvas'); 

     canvg(canvas, svg); 

     nodesToRecover.push({ 
      parent: parentNode, 
      child: node 
     }); 

     parentNode.removeChild(node); 

     nodesToRemove.push({ 
      parent: parentNode, 
      child: canvas 
     }); 

     parentNode.appendChild(canvas); 
    }); 

    html2canvas(targetElem, { 
     allowTaint: true, 
     onrendered: function(canvas) { 

      var theName = fileName + ".png"; 
      prev_img = theName; 

      var a = document.createElement('a'); 
      a.href = canvas.toDataURL(); 
      a.download = theName; 
      a.click(); 

     } 

    }); 

} 

#Running the function.. 
var theDiv = $('#divContainingSVG'); 
var fileNm = "imageName"; 
svgToCanvas(theDiv, fileNm); 

Nicht sicher wohin als nächstes. Ich muss einfach das Bild in ein PNG konvertieren und dann auf dem Server speichern. Beim Testen der Download-Version ist das resultierende PNG leer. Beachten Sie, dass ich ... canvg.js (einschließlich rgbcolor.js) und html2canvas.svg.js verwende

Vielen Dank im Voraus!

Answer 1

Tatsächlich stellt sich heraus, dass diese Funktion gut funktioniert. Das Problem war ein Konflikt mit einer anderen Funktion, die irrtümlich dazu verwendet wurde, die SVG zu bekommen.