IvanNewYork
IvanNewYork

Reputation: 447

How can i automatically resize a photo from flickr api?

For my recent project I want to use images fro the flickr api but when the images come in most of the images are too big for the place that I have it on. I was told to make an if statement and get the length and width from the original image arriving from the api and divide them then multiply them by the desired width. The else is the opposite (instead of width height). This is what I came up with but can't get it to work. Can someone tell me what am I doing wrong?

var dimensions = getDimensions(photos[p].width_m, photos[p].height_m);
var m1window = addWindow(photos[p].title, photos[p].url_m, dimensions[0], dimensions[1]);

function getDimensions( w, h ) {
    var array = [wi, he];
    var he;
    var wi;
    if ( wi > he ) {
        wi = 100;
        he = w/h*100;
    } else {
        wi = w/h*100;
        he = 100;
    }    
    return array;       
}

Upvotes: 2

Views: 611

Answers (1)

Josep
Josep

Reputation: 13071

I'm not sure if I understood your problem, but if your problem is that you need to resize your image to a certain container that has a maximum width and height, then I think that what you want is a function like this (using JQuery):

function resizeImage($image, maxHeight, maxWidth){
    var ratio=1;
    var ratiox=1;
    var ratioy=1;    
    var imgWidth=$image.width();    
    var imgHeight=$image.height();

    if(imgWidth> maxWidth){
        ratiox=maxWidth/imgWidth;
    }
    if(imgHeight> maxHeight){
        ratioy=maxHeight/imgHeight;
    }
    ratio = (ratiox>ratioy)?ratioy:ratiox;
    $image.width(imgWidth*ratio);
    $image.height(imgHeight*ratio);
}

JSFiddle example: http://jsfiddle.net/8uJbY/2/

(If this is what you need but you can't use JQuery I can rewrite this function without JQuery)

Upvotes: 1

Related Questions