Question

好的，在previous question of mine中，我发现我正在使用的浏览器出于某种原因不支持toDataURL（）。我尝试使用像todataur-png-js这样的解决方法，但无济于事，因为它也失败了。我想到了我可以让PHP根据画布中的像素数据构建一个图像并将其保存为图像。但是，我对画布的经验不多，也不知道如何做这样的事情。有任何想法吗？向正确的方向轻推也足够了。 =）

Answer 1

如果您已有像素数组，则可以使用GD库的imagecreatetruecolor()和imagesetpixel()函数完成此操作：

// Assume $pixelArray is a 2-dimensional array of colors for the pixels

// Grab the dimensions of the pixel array
$width = count($pixelArray, 0);
$height = count($pixelArray);

// Create the image resource
$img = imagecreatetruecolor($width, $height);

// Set each pixel to its corresponding color stored in $pixelArray
for ($y = 0; $y < $height; ++$y) {
    for ($x = 0; $x < $width; ++$x) {
        imagesetpixel($img, $x, $y, $pixelArray[$y][$x]);
    }
}

// Dump the image to the browser
header('Content-Type: image/png');
imagepng($img);

// Clean up after ourselves
imagedestroy($img);

如果要将图像保存到磁盘而不是将其转储到浏览器，只需忽略对header()的调用，并将路径传递给imagepng()作为第二个参数：

imagepng($img, '/some/path/to/your/desired/image.png');

Answer 2

目前还不清楚您是否能够在Netfront浏览器中获取画布的像素数据。

在示例页面中，更改按钮处理程序代码：

var cv=document.getElementsByTagName('canvas')[0];document.documentElement.style.background='url('+cv.toDataURL()+')';

对此：

var cv=document.getElementsByTagName('canvas')[0];alert(cv.toDataURL());

是否显示弹出的alert()中的任何像素数据？

如果确实如此，那么您似乎无法在此浏览器的背景图片中使用数据网址。如果它没有，那么看起来你的画布不支持getImageData()。

从像素阵列创建图像服务器端

2 个答案: