Loaded image displays with wrong orientation

beginners
#1

Hi,

Im loading images to my application using the drag and drop methods from the one of the example app in OF, now most of the images com form a mobile so the orientation is unpredictable, now the images show in the right orientation in cover flow view but when I drag them they can load in landscape when it should be portrait, so I wonder if there is a way of getting the loaded images to display in the right orientation.

Any help will be much appreciated

#2

the orientation of the image is probably in the exif metadata. a quick google search gives this library:

http://www.exiv2.org/

but anything that can parse the exif info from the image should do, in osx there’s probably even something in the os apis

#3

Gracias Arturo, unfortunately for me implementing that library is out of my reach, you see I only use OF as a hobby, so compiling and implementing libraries is too complicated for me.

I just discover the rectangleAlignmentAndScaling example so all I need to do is rotate the image and rescale it accordingly that may be easier for me to implement :wink:

#4

This is a very old thread, but for anyone looking for a way to do this within oF easily without having to mess with esoteric exif manipulation APIs, just rotate the images within oF and then re-save them. They’ll get brand new orientation data that oF can of course recognize just fine. I had a folder of photos whose orientation wouldn’t show up properly in oF- some needed to be rotated 90 degrees, some 180 and some 0. So I made a script to quickly browse through them and adjust them accordingly. There’s also a “best fit” algorithm in here for displaying the images (the getDrawRect() method)

The only drawback I can think of is that the re-saved photos can be larger than the original, but you could experiment with setting the image quality in the save() method.

//ofApp.h
#include "ofMain.h"
#include "ofxGui.h"
class ofApp : public ofBaseApp{
       //... general oF stuff
    ofRectangle getDrawRect(ofxDSHapVideoPlayer& video);|
    ofRectangle getDrawRect(int imgW, int imgH);|

    ofxPanel m_gui;
    ofParameter<int> t_imageIndex;
    ofDirectory dir;					
	float m_screenAspect;
	ofImage t_photo;


//ofApp.cpp
#include "ofApp.h"
void ofApp::setup(){
	m_screenAspect = ofGetWidth() / float(ofGetHeight());

	dir = ofDirectory("photos");
	dir.allowExt("PNG");
    dir.allowExt("JPG");
	dir.listDir();

    m_gui.setup();
	m_gui.add(t_imageIndex.set("image index", 0, 0, dir.size() - 1));

	ofSetVerticalSync(true);
	ofBackground(0);

	t_photo.load(dir.getPath(t_imageIndex));
}
void ofApp::draw(){
	ofRectangle r = getDrawRect(t_photo);
	t_photo.draw(r);	
	m_gui.draw();
}

ofRectangle ofApp::getDrawRect(ofImage& image)
{
	return getDrawRect(image.getWidth(), image.getHeight());
}

ofRectangle ofApp::getDrawRect(int imgW, int imgH)
{
	int x, y, w, h;
	float imageAspect = imgW / float(imgH);
	if (imageAspect >= m_screenAspect)
	{
		w = ofGetWidth();
		h = w / imageAspect;
	}
	else
	{
		h = ofGetHeight();
		w = h * imageAspect;
	}
	x = ofGetWidth() / 2 - w / 2;
	y = ofGetHeight() / 2 - h / 2;
	return ofRectangle(x, y, w, h);
}

void ofApp::keyPressed(int key){
	switch (key)
	{
	case ' ':
		t_photo.save(dir.getPath(t_imageIndex));
		break;
	case OF_KEY_RIGHT:
		t_photo.rotate90(1);
		break;
	case OF_KEY_LEFT:
		t_photo.rotate90(-1);
		break;
	case 'a':
		t_imageIndex.set(std::max(t_imageIndex.get() - 1, t_imageIndex.getMin()));
		t_photo.load(dir.getPath(t_imageIndex.get()));
		break;
	case 'd':
		t_imageIndex.set(std::min(t_imageIndex.get() + 1, t_imageIndex.getMax()));
		t_photo.load(dir.getPath(t_imageIndex.get()));
		break;
	}
}
#5

Lately I’ve been using ofSystem() to see if an image needs to be rotated after its loaded. With macOS this does the trick:

// rotate with orientation
    std::string call = "mdls -name kMDItemOrientation " + sourceDirectory.getFile(indexImages).getAbsolutePath();
    std::string system = ofSystem(call);
    std::string orientation = system.substr(system.size() - 2, 1);
    if(orientation == "1") {image.rotate90(1);}

I think linux has something similar, as somehow the Mint image viewer knows which images to rotate.