角度裁剪的圖像文件尺寸變大

我使用此插件angular-image-cropper裁剪我的圖像和ng-file-upload上傳我的圖像。角度裁剪的圖像文件尺寸變大

問題是說我的圖像尺寸是1955px * 1300px大小約194kb。

我剪裁到800px * 450px後，尺寸變成550kb左右。

這是正確的嗎？因爲它幾乎成爲4倍大，從它的原始尺寸

我的html代碼：

<div class="form-group"> 
    <label class="control-label">Cover</label> 
    <input type="file" ngf-select="uploadFiles($files,$invalidFiles)" name="cover" id="cover" ngf-pattern="image/*" accept="image/*" 
     ng-model="upload.coverSource" ngf-max-size="512KB" ngf-min-width="800" img-cropper-fileread image="upload.coverSource" 
     disable-invalid-styling="true" disable-valid-styling="true"> 

     <canvas ng-show="upload.coverSource" width="500" height="281" id="canvas" image-cropper image="upload.coverSource" 
     cropped-image="category.coverCrop" crop-width="800" crop-height="450" keep-aspect="true" crop-area-bounds="bounds"> 
     </canvas> 
</div>

在我的角度我只是試圖CONSOLE.LOG他們兩個：

console.log($scope.upload.coverSource); 

// and i need to convert it to blob first to get the data. 
// category.coverCrop value is in data:base64 

var cover = Upload.dataUrltoBlob(category.coverCrop); 
console.log(cover);

這裏是結果截圖：

任何解決方案使尺寸相同或更小？

來源

2016-01-12 ssuhat

在我測試過的大多數修剪器中，生成的圖像被轉換爲原始格式，使其變大，在您的信息的情況下，看圖像是以其原始base64格式，也是這裏具有相似結果的相當高級的編輯器的示例：https://www.photoeditorsdk.com/事情是壓縮或任何進一步處理是與裁剪不同的任務，並且通常不由此庫處理;所以你如何解決它？在我們的案例中，我們與cloudinary.com集成並使用他們的轉換API來確保我們的所有圖像具有合適的尺寸和質量。

來源

2017-05-04 01:25:32

角度裁剪的圖像文件尺寸變大

回答

相關問題