Question

我制作 ~~试图使~~无法制作一个JavaScript / HTML应用程序，你基本上只是画一幅画。现在，像素变得模糊，并且不像我希望的那样清晰。也许更有问题的是，“像素”在某个指数值处偏移，但我没有最模糊的线索。

到目前为止，这是代码：

<!DOCTYPE html>
<html>

<script>
function changePixel(event) {
    var x = Math.floor(event.screenX);
    var y = Math.floor(event.screenY);
    var canvas = document.getElementById("canvas");
    var container = canvas.getContext("2d");
    //if (container.style.backgroundColor == "rgb(0, 0, 0)") {
        //container.fillStyle = "rgb(255, 255, 255)";
        //container.fillRect( event.clientX, event.clientY, 1, 1 );
    //} else {
        container.fillStyle = "rgb(255, 0, 0)";
        container.fillRect( x, y, 1, 1 );
    //}
}
</script>

<body>

<canvas id="canvas" onclick = "changePixel(event)" style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; color: rgb(0, 255, 0);"></canvas>

</body>
</html>

另一个注意事项，我的确计划将这个应用程序设为PHP（是的，我确实有一个服务器），所以你可以和其他一些人在线编辑画布，所以如果你预见到任何这个代码冲突的话有了这个想法，请说出来。

谢谢，伙计们！

HTML Pixel Draw Thingy

0 个答案: