Отображение изображения, взятого с камеры (Ionic/Cordova) с использованием base64

Question

Я использую ионную структуру, и я столкнулся с небольшой проблемой. У меня есть кнопка, называемая «upload», и когда я нажимаю ее, я делаю снимок с помощью «$ cordovaCamera». Я получаю изображение как строку base64, а затем у меня есть переменная с именем $ scope.hold, которая хранит строку base64 (imageData).

Проблема в том, что изображение, которое появляется, как только я беру изображение, является размытым. Я не уверен, что такое ошибка. У меня есть «100» как «качество» в моей переменной «options». Кто-нибудь, пожалуйста, посоветуйте? Я знаю, что есть лучшие способы сделать это, а не base64, но я придерживаюсь этого метода.

В моем HTML файл у меня есть:

<img id="pic" data-ng-src="data:image/jpeg;base64,{{hold}}" width="100%" /> 

Мой Javascript контроллер выглядит следующим образом:

$scope.upload = function() { 
     var options = { 
      quality: 100, 
      destinationType: Camera.DestinationType.DATA_URL, 
      sourceType: Camera.PictureSourceType.PHOTOLIBRARY, 
      allowEdit: true, 
      encodingType: Camera.EncodingType.JPEG, 
      targetWidth: 100, 
      targetHeight: 100, 
      popoverOptions: CameraPopoverOptions, 
      saveToPhotoAlbum: false, 
      correctOrientation:true 
     }; 

     $cordovaCamera.getPicture(options).then(function(imageData) { 

      alert("Got it!!"); 
      $scope.hold = imageData; 


     }, function(err) { 
      alert("We have an error: " + error); 
     }); 
    }; 

Заранее спасибо!

Answer 1

Используйте приведенный ниже код основной причиной изображение становится размытым, потому что вы установили качество 100. Изменение качества и увидеть изменения

var options = { 
      quality : 75, 
      destinationType : Camera.DestinationType.DATA_URL, 
      sourceType : Camera.PictureSourceType.CAMERA, 
      allowEdit : false, //To enable/disable the user editing in camera 
      encodingType: Camera.EncodingType.JPEG, 
      targetWidth: 640, 
      targetHeight: 400, 
      popoverOptions: CameraPopoverOptions, 
      saveToPhotoAlbum: false 
     };