Issue
In a React Native, in an Expo managed app, I want to retrieve an image(s) from the ImagePicker and pass it through the tf.image.ssim
function of tensorflow , here is what I have done so far:
import React, { useState } from 'react';
import { Button, Image, View } from 'react-native';
import * as tf from '@tensorflow/tfjs';
import * as ImagePicker from 'expo-image-picker';
import * as FileSystem from 'expo-file-system';
export default function App() {
const [image, setImage] = useState(null);
const pickImage = async () => {
let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.All,
quality: 1,
});
const img64 = await FileSystem.readAsStringAsync(result.uri, { encoding: 'base64' });
const rawImageData = tf.util.encodeString(img64, 'base64');
// Calling tensorflow.image.ssim function FAILS
tf.image.ssim(rawImageData, rawImageData)
if (!result.cancelled) {
setImage({uri: result.uri, fileSize: result.fileSize});
}
};
return (
<View style={{ flex: 1, backgroundColor: "white", marginTop: 40 }}>
<Button title="Pick image from camera roll" onPress={pickImage} />
{image && <Image source={{ uri: image.uri }} style={{ width: 200, height: 200 }} />}
</View>
);
}
But this returns an error:
WARN Possible Unhandled Promise Rejection (id: 0): TypeError: undefined is not an object (evaluating 'env().platform.encode')
I have been looking on other posts but no post corresponds to this issue.
Any idea ?
Thanks
p.s: normally we pass two different images to ssim, but this is just to see if it works
Solution
entire tf.image
namespace in tensorflow
is an add-on.
tfjs implements some of its own tf.image
methods, but overlap between python tf.image
namespace and tfjs tf.image
namespace is near-zero.
if you want .ssim
method, you'd need to implement it yourself in tfjs - it simply does not exist.
Answered By - Vladimir Mandic
Answer Checked By - - Marilyn (ReactFix Volunteer)