I'm trying to develop a program that classifies images using tensorflow and knn-classifier. However, in order to train the program, I need to get images as either ImageData, HTMLImageElement or HTMLCanvasElement.
Hence, I'm looking for a way to get one of these objects simply from the image url (e.g. "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/Image_created_with_a_mobile_phone.png/1200px-Image_created_with_a_mobile_phone.png")
It may be worth mentioning that I'm using nodejs for development. I've attached some code below to help explain what I'm trying to achieve.
const tf = require("@tensorflow/tfjs");
const mobilenetModule = require("@tensorflow-models/mobilenet");
const knnClassifier = require("@tensorflow-models/knn-classifier");
const classifer = knnClassifier.create();
async function start() {
const mobilenet = await mobilenetModule.load();
const pic0 = // Get image from "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/Image_created_with_a_mobile_phone.png/1200px-Image_created_with_a_mobile_phone.png";
const img0 = tf.browser.fromPixels(pic0);
const logits0 = mobilenet.infer(img0, true);
classifier.addExample(logits0, 0);
const pic1 = // Get image from "https://www.pixsy.com/wp-content/uploads/2021/04/ben-sweet-2LowviVHZ-E-unsplash-1.jpeg";
const img1 = tf.browser.fromPixels(pic1);
const logits1 = mobilenet.infer(img1, true);
classifier.addExample(logits1, 0);
const check = await axios.get(
"https://cryptotvnetwork.com/wp-content/uploads/2021/04/4ee1ad2ffbb00866fb7c55c61786e95d.jpg",
{ responseType: "arrayBuffer", }
);
const x = tf.browser.fromPixels(check);
const xlogits = mobilenet.infer(x, true);
const p = classifier.predictClass(xlogits);
console.log(p);
}
start();
I apologize in advance if this is a stupid or duplicate question however I haven't been able to find on this during my time searching.
The tensor has to be created once the image is loaded.
async function getImage() {
var pic0 = new Image();
pic0.src = 'https://www.google.com/favicon.ico';
pic0.onload = () => {
var img0 = tf.browser.fromPixels(pic0);
return img0;
}
}