如何编辑使用编辑器保存的图像

Question

我正在使用画布和布料js开发图像编辑器。

我的问题是如何编辑一个图像，这是通过使用编辑器保存。保存图像时我必须更改扩展名或什么？

所以请如果有人知道这个问题请帮助我。提前Thanx。

Answer 1

var canvas = new fabric.Canvas('canvas'); 
 
      document.getElementById('file').addEventListener("change", function (e) { 
 
       var file = e.target.files[0]; 
 
       var reader = new FileReader(); 
 
       reader.onload = function (f) { 
 
        var data = f.target.result; 
 
        fabric.Image.fromURL(data, function (img) { 
 
         var oImg = img.set({left: 50, width:100, height:100, top: 100, angle: 00}).scale(0.5); 
 
         canvas.add(oImg).renderAll(); 
 
         var a = canvas.setActiveObject(oImg); 
 
        var dataURL = canvas.toDataURL({ format: 'jpeg', quality: 0.8 }); 
 

 
    console.log("Canvas Image " + dataURL); 
 
       document.getElementById('txt').href=dataURL; 
 
}); 
 
       }; 
 
       reader.readAsDataURL(file); 
 
       
 
       
 
      });

canvas{ 
 
       border: 1px solid black; 
 
      }

<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.min.js"></script> 
 
     <canvas id="canvas" width="300" height="300"></canvas> 
 
     <input type="file" id="file"> 
 
     <a href='' id='txt'>Click Me!!</a>