Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Inconsistent image size from result #297

Closed
jme71 opened this issue Mar 25, 2017 · 1 comment
Closed

Inconsistent image size from result #297

jme71 opened this issue Mar 25, 2017 · 1 comment

Comments

@jme71
Copy link

jme71 commented Mar 25, 2017

After using the result() method as shown below, I'm getting a really inconsistent image size. Sometimes the output gives me a 155x155 image, and other times it's over 700x700. Either this is a bug, or I'm using it wrong.

Here's how I'm initializing croppie:

var preview = document.getElementById('ProfilePicturePreview');  
$(preview).html("");  
croppie = new Croppie(preview, {  
    viewport: {  
        width: 150,  
        height: 150  
    },  
    boundary: {  
        width: 500,  
        height: 500  
    }  
});  
croppie.bind({  
    url: data.fileName + "?v=" + Date.now()  
});

And here's how I'm calling result():

            croppie
                .result('base64', 'viewport')
                .then(function(base64) {
                    $("#SaveCroppedProfilePicture").addClass("disabled");
                    $("#SaveCroppedProfilePicture .saving-indicator").show();
                    
                    $.ajax({
                        type: "POST",
                        url: "/User/SaveCroppedProfilePicture",
                        traditional: true,
                        data: {
                            base64Picture: base64
                        }
                    })
                    .done(function (data) {
                        if (data.success === true)
                        {
                            $("#imgProfilePicture").attr("src", data.profilePictureFileLocation + "?v=" + Date.now());
                            $("#SaveCroppedProfilePicture .saving-indicator").hide();
                            $("#SaveCroppedProfilePicture").removeClass("disabled");
                            $("#ProfilePicturePreviewDialog").modal("hide");
                        }
                        else
                        {
                            alert(data.errorMessage)
                        }
                    })
                    .fail(function (e) {
                        alert('Cannot upload profile image at this time.');
                        $("#SaveCroppedProfilePicture .saving-indicator").hide();
                        $("#SaveCroppedProfilePicture").removeClass("disabled");
                        $("#ProfilePicturePreviewDialog").modal("hide");
                    });
                });
@BassT
Copy link
Contributor

BassT commented Apr 6, 2017

Try calling result with {type: 'base64', size: 'viewport'}. Then you should always get the right size.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants