0

I'm new to developing with AngularJs and I have a function where converting images to base 64 using the Angular-Base64-Upload, I'd like to know how to resize images to a standard size of about 500px.

   $scope.upload = function (file) {
  Upload.base64DataUrl(file).then(
    function (url){
      $scope.data['usu_foto'] = url;
    });
};

1 Answers1

0
app.controller('ctrl', function ($scope, $q) {

  $scope.resizeImage = function ( file, base64_object ) {
    // file is an instance of File constructor.
    // base64_object is an object that contains compiled base64 image data from file.
    var deferred = $q.defer();
    var url = URL.createObjectURL(file);// creates url for file object.
    Jimp.read(url)
    .then(function (item) {
      item
      .resize(1280, Jimp.AUTO)// width of 1280px, auto-adjusted height
      .quality(50)//drops the image quality to 50%
      .getBase64(file.type, function (err, newBase64) {
        if (err) {throw err;}
        var bytes = Math.round((3/4)*newBase64.length);
        base64Object.filetype = file.type;
        base64Object.filesize = bytes;
        base64Object.base64 = newBase64;
        // Note that base64 in this package doesn't contain "data:image/jpeg;base64," part,
        // while base64 string from Jimp does. It should be taken care of in back-end side.
        deferred.resolve(base64Object);
      });
    })
    .catch(function (err) {
      return console.log(err);// error handling
    });
    return deferred.promise;
  };

});

Basically you can just use resize function. More details could be found there: https://github.com/adonespitogo/angular-base64-upload

Vossen
  • 162
  • 7