Views
No views yet
1# Using npm
2npm install @tensorflow/tfjs
3
4# Using yarn
5yarn add @tensorflow/tfjs1import * as tf from '@tensorflow/tfjs';
2
3// The URL to the model.json file in this repository
4const MODEL_URL = '[https://huggingface.co/shammisw/real-cugan-tensorflowjs/resolve/main/real-cugan-models/realcugan/4x-conservative-64/model.json](https://huggingface.co/shammisw/real-cugan-tensorflowjs/resolve/main/real-cugan-models/realcugan/4x-conservative-64/model.json)';
5
6async function upscaleImage(imageElement) {
7 try {
8 // 1. Load the model
9 console.log('Loading model...');
10 const model = await tf.loadGraphModel(MODEL_URL);
11 console.log('Model loaded.');
12
13 // 2. Prepare the input tensor from an HTMLImageElement
14 // Models are trained on float32 tensors, normalized to the [0, 1] range.
15 const inputTensor = tf.browser.fromPixels(imageElement)
16 .toFloat()
17 .div(255.0)
18 .expandDims(0); // Add batch dimension: [h, w, c] -> [1, h, w, c]
19
20 // 3. Run inference
21 console.log('Running inference...');
22 const outputTensor = model.execute(inputTensor);
23
24 // 4. Process the output and display it on a canvas
25 const outputCanvas = document.getElementById('output-canvas');
26 await tf.browser.toPixels(outputTensor.squeeze(), outputCanvas);
27 console.log('Upscaling complete!');
28
29 // 5. Clean up tensors
30 tf.dispose([inputTensor, outputTensor]);
31
32 } catch (error) {
33 console.error('Failed to upscale image:', error);
34 }
35}
36
37// Find your input image element and pass it to the function
38const myImage = document.getElementById('my-input-image');
39upscaleImage(myImage);-64) refers to the tile size used during conversion, which can affect performance and memory usage.| Model Type | Scale | Denoise Level | Path |
|---|---|---|---|
| Conservative | 2x | - | real-cugan-models/realcugan/2x-conservative-64/ |
| Conservative | 4x | - | real-cugan-models/realcugan/4x-conservative-64/ |
| More models can be added here as they are converted. |