7

这应该很容易,但我找不到答案。在将图像上传到我们的服务器之前,我需要通过 Phonegap 中的 fileURI 获取图像的宽度和高度。当然,在上传之前必须有一些 html5 / Phonegap 魔法来完成这项工作。这是一些真正简化的代码,以显示我的位置:

function got_image(image_uri) {
    // Great, we've got the URI
    window.resolveLocalFileSystemURI(image_uri, function(fileEntry) {
        // Great, now we have a fileEntry object.
        // How do we get the image width and height?
    })
}

// Get the image URI using Phonegap
navigator.camera.getPicture(got_image, fail_function, some_settings)

知道缺失的部分是什么吗?我希望我在快速拨号上有Simon MacDonaldShazron,但我没有。

4

5 回答 5

8

Here is a proper solution.

Pass this function an imageURI. URIs are returned from both of PhoneGap's getPicture() methods.

Like this: get_image_size_from_URI(imageURI)

function get_image_size_from_URI(imageURI) {
    // This function is called once an imageURI is rerturned from PhoneGap's camera or gallery function
    window.resolveLocalFileSystemURI(imageURI, function(fileEntry) {
        fileEntry.file(function(fileObject){
            // Create a reader to read the file
            var reader = new FileReader()

            // Create a function to process the file once it's read
            reader.onloadend = function(evt) {
                // Create an image element that we will load the data into
                var image = new Image()
                image.onload = function(evt) {
                    // The image has been loaded and the data is ready
                    var image_width = this.width
                    var image_height = this.height
                    console.log("IMAGE HEIGHT: " + image_height)
                    console.log("IMAGE WIDTH: " + image_width)
                    // We don't need the image element anymore. Get rid of it.
                    image = null
                }
                // Load the read data into the image source. It's base64 data
                image.src = evt.target.result
            }
            // Read from disk the data as base64
            reader.readAsDataURL(fileObject)
        }, function(){
            console.log("There was an error reading or processing this file.")
        })
    })
}
于 2013-02-28T19:47:37.273 回答
3

The following code solves the same problem for me today (tested on iOS):

function got_image(image_uri)
{       
    $('<img src="'+image_uri+'"/>').on('load',function(){
        alert(this.naturalWidth +" "+ this.naturalHeight);
    });
}

Hope it helps!

于 2013-09-13T16:56:22.720 回答
1

我认为您可以使用 getPicture() 的目标宽度和高度来限制最大尺寸。如果您需要将它们发送到服务器,我认为服务器代码将有助于获得这些维度。

如果你真的需要通过js获取那些维度,你可以

var img = new Image;
img.onload = function(){
  myCanvasContext.drawImage(img,0,0);
};
img.src = "data:YOUR_BASE64_DATA";

你可以用 img 做到这一点

于 2013-02-28T03:29:13.367 回答
0

1.Phonegap supply a way to specific the size of the image you choose Click here to see the options

2.If you need to know the original size and do not want to specific, you may try the code below:

function got_image(image_uri) {
    window.resolveLocalFileSystemURI(image_uri, function(fileEntry) {
       fileEntry.file(function (fileObj) {
                    var fileName = fileObj.fullPath;
                    var originalLogo = new Image();
                    originalLogo.src =fileName;
                    //get the size by: originalLogo.width,originalLogo.height
                });
    })
}
于 2013-03-01T02:17:11.317 回答
0

one way you can do this is by using the MediaFile from the Capture API.

var mediaFile = new MediaFile("myfile.jpg", "/path/to/myfile.jpg");
mediaFile.getFormatData(function(data) {
    console.log("width: " data.width);
    console.log("height: " data.height);
});

Should be a lot less code than the current accepted solution.

于 2013-03-10T02:55:54.963 回答