我是 ReactJS 的新手。我正在尝试在 ReactJS 应用程序中使用 Magenta TensorflowJS 库中预先训练的任意样式传输模型。https://www.npmjs.com/package/@magenta/image 尽管在 javascript 中有一个代码示例,但我发现很难将它纳入 React。这是 magenta npm 的示例代码,
import * as mi from '@magenta/image';
const model = new mi.ArbitraryStyleTransferNetwork();
const contentImg = document.getElementById('content') as HTMLImageElement;
const styleImg = document.getElementById('style') as HTMLImageElement;
const stylizedCanvas = document.getElementById('stylized') as HTMLCanvasElement;
function stylize() {
model.stylize(contentImg, styleImg).then((imageData) => {
stylizedCanvas.getContext('2d').putImageData(imageData, 0, 0);
});
}
model.initialize().then(stylize);
我正在上传两个用户图像并将其 URL 存储在两个变量中。对于模型输入,要给出的基本图像和样式图像 URL 还是作为输入的图像?如链接中的示例所示,我不确定如何在 React 中调用 canvas 元素。如何在 ReactJS 中调用这个预训练模型?