Javascript context.getImageData()是黑色的

时间:2016-01-24 15:49:23

标签: javascript canvas getimagedata

http://pastebin.com/gMRS8uYU

解决。我安装了CanvasFingerprintBlock。

我想画一些东西并阅读颜色,但每次运行它都会返回[0, 0, ....] RGBA颜色。

imgData.data.reduce((a, b) => a + b); // => 0

你们中有谁知道我做错了什么,可以帮助我吗?

感谢。

function main() {
 
  var BITS = 8;
  var POWER = 4;
  var WIDTH = Math.pow(2, POWER);
  var HEIGHT = Math.pow(2, POWER);
  var chartData = [];

  var data = [];
  var canvas = document.getElementById("canvas");
  canvas.width = WIDTH;
  canvas.height = HEIGHT;
  var context = canvas.getContext("2d");

  for (var _ = 0; _ < 1; _++) {
    var char = Math.floor(Math.random() * 10);
    context.clearRect(0, 0, WIDTH, HEIGHT);
    context.fillStyle = "gray";
    context.fillRect(0, 0, WIDTH, HEIGHT);

    context.font = HEIGHT + 'px Arial';
    context.fillStyle = "black";
    context.textBaseline = "middle";
    context.textAlign = "center";
    context.fillText(char+"", WIDTH / 2, HEIGHT / 2);

    var imgData = context.getImageData(0, 0, WIDTH, HEIGHT);
    var grayScale = Array.apply(null, new Array(WIDTH * HEIGHT)).map((v) => 0);
    var __constNum = 255 * 255;
    document.getElementById("quadDiffChart").innerHTML = imgData.data.reduce((a, b) => a + b);

  }


};
<?php
include("init.php");
?>
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <style media="screen">
      #can{
 
      }
    </style>
    <?php
   printCSS();
   ?>
  </head>
  <body onload="main()">
    <div id="quadDiffChart">
 
    </div>
 
    <canvas id="canvas" width="300" height="300"></canvas>
  </body>
</html>

0 个答案:

没有答案