tf.browser.fromPixels returns only zeros

问题

Here tf.browser.fromPixels returns a tensor with only zeros. image.data contains values as expected (not only zeros). tfjs is loaded using a script tag. tfjs 1.0.0 but changing release does not help.

What can be wrong? Probably something stupid. I am new to Tensorflow.js...

<canvas id="canvas" width="100" height="100" style="border:1px solid #FF0000;"></canvas>
....
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');   
var image = ctx.getImageData(0, 0, canvas.height, canvas.width);
var x = tf.browser.fromPixels(image);

回答1:

When created, the canvas has all its pixel values set to 0.

var canvas = document.getElementById('canvas');

canvas is an imageData with only 0 values. It is no surprise that the tensor created has its values to 0 since the canvas used to created it does not have any image data except 0 values.

The CSS style does not change the underlying value of canvas. As a result, even if there is a border-color that is set to red, it is not reflected on the imageData.

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var image = ctx.getImageData(0, 0, canvas.height, canvas.width);
var x = tf.browser.fromPixels(image);

console.log(x.shape) // height, width, 3

<html>
  <head>
    <!-- Load TensorFlow.js -->
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.0.0"> </script>
  </head>

  <body>
  <canvas id="canvas" width="100" height="100" style="border:1px solid #FF0000;"></canvas>
  </body>
</html>

回答2:

The problem was that I used ctx.strokeStyle = '#000000' (black). But the canvas is already filled with 0 (as edkeveked said). This means that the drawing is not visible. What I saw as data was probably the alpha-channel but the alpha-channel is removed by fromPixels.

The solution is to use another strokeStyle than '#000000' and/or use ctx.fillRect with fillStyle = "#FFFFFF" (white).

So fromPixels is OK...

来源：https://stackoverflow.com/questions/55079831/tf-browser-frompixels-returns-only-zeros

标签

tensorflow.js