Get base64 string of frame

0 favourites
  • 3 posts
From the Asset Store
three fully animated characters ideal for your RPG side scroller projects
  • Hello,

    can someone help me to get base 64 string of sprite's frame ?

    I have tried these function but it doesn't work...

    function toDataUrl(src, callback, outputFormat) {
      var img = new Image();
      img.crossOrigin = 'Anonymous';
      img.onload = function() {
        var canvas = document.createElement('CANVAS');
        var ctx = canvas.getContext('2d');
        var dataURL;
        canvas.height = this.height;
        canvas.width = this.width;
        ctx.drawImage(this, 0, 0);
        dataURL = canvas.toDataURL(outputFormat);
        callback(dataURL);
      };
      img.src = src;
      if (img.complete || img.complete === undefined) {
        img.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
        img.src = src;
      }
    }
    
    //then execute :
    var url = this.inst.cur_animation.frames[this.inst.cur_frame].texture_img.src;
    toDataUrl(url, function(base64Img) {
      console.log(base64Img);
    });
    [/code:1naz8ifx]
    
    I have also tried this code:
    [code:1naz8ifx]
    function getBase64FromImageUrl(url) {
        var img = new Image();
    
        img.setAttribute('crossOrigin', 'anonymous');
    
        img.onload = function () {
            var canvas = document.createElement("canvas");
            canvas.width =this.width;
            canvas.height =this.height;
    
            var ctx = canvas.getContext("2d");
            ctx.drawImage(this, 0, 0);
    
            var dataURL = canvas.toDataURL("image/png");
    
            alert(dataURL.replace(/^data:image\/(png|jpg);base64,/, ""));
        };
    
        img.src = url;
    }
    
    //then execute:
    var url = this.inst.cur_animation.frames[this.inst.cur_frame].texture_img.src;
    getBase64FromImageUrl(url);
    [/code:1naz8ifx]
    
    Thanks fro your help!
  • I think you're trying to make what Pode already made. So you can take a look at his code:

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Hi,

    Thanks for your precious help, I had searched before posting but I have not found!

    Really thanks

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)