Question

我有兴趣拍摄任何典型格式的图像，例如PNG，JPEG等等，并将其重新创建为一组排列的，单独着色的，1 x 1像素的HTML元素，或者某种东西像那样。我希望能够使用，即风格和脚本（移动，颜色变化等），图像的各个像素。我怎么能实现这个目标？ SVG浮现在脑海中，但如果它应该在我看的地方，我现在还不够熟悉它。

Answer 1

使用画布可以使用您命名的三种语言帮助绘制图像。例如：

<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>

<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0,0,150,75);
</script>

这可以在框内创建一个红色方块。您也可以使用

创建圈子

ctx.arc();
ctx.stroke();

http://www.w3schools.com/html/html5_canvas.asp他们还会为您提供大量细节，以便使用每种画布方法。

希望这就是你要找的东西！

如何仅使用网络技术（例如，HTML，CSS和Javascript）重新创建图像，例如.png或.jpg？

1 个答案: