Rotated output of transformed base64 image

[lbialkowski]

Hello, thank you for your contribution to this great project! I have noticed that using the following code causes the image result to be rotated by 90 degrees:

const src = OpenCV.base64ToMat(base64);
const dstResult = OpenCV.toJSValue(src);

Do you have any suggestions on how to fix this? I am using expo-file-system to convert files into base64.

[lukaszkurantdev]

Hi @lbialkowski. Probably it is issue with image itself (and library to save or pick image). You can try to set correct Orientation using ImageManipulator.

It's popular bug inside this type of libraries: https://github.com/expo/expo/issues/16837 https://github.com/ivpusic/react-native-image-crop-picker/issues/1696

Always you can use rotate function from this library if you want to rotate matrix: invoke(name: 'rotate', src: Mat, dst: Mat, code: RotateFlags): void;

But the problem is beyond this library.

[lbialkowskiBlurify]

@lukaszkurantdev, thanks for your response!

After further testing, I found that my issue only occurs on iOS devices (it works fine on Android). Here's what I am doing step by step:

Taking a picture using react-native-vision-camera. Reading the output path from react-native-vision-camera and converting it into base64 using expo-file-system. Processing the image using react-native-fast-opencv. Saving the output base64 into a temp file again using expo-file-system. Saving the image to the camera roll using expo-media-library. As a quick workaround, I added an extra step for iOS devices to rotate the image back using expo-image-manipulator.

However, I believe rotating the image using OpenCV would be more performant, but I suspect there might be an issue with the documentation. Please take a look at this: https://lukaszkurantdev.github.io/react-native-fast-opencv/availablefunctions#rotate

It mentions 'repeat' instead of 'rotate', and TypeScript also doesn't compile. After ignoring the TypeScript error, a rejected promise issue occurs, regardless of whether I use 'repeat' or 'rotate'.

// this code throws an error
OpenCV.invoke('rotate', dst, dstRotated, RotateFlags.ROTATE_90_CLOCKWISE);

Could you take a look at it?

[lukaszkurantdev]

@lbialkowskiBlurify It's available since v.0.2.7 - I've added it today (xD) After I saw your message and checked that this feature was missing :)

[lbialkowskiBlurify]

Thanks, it works :)