画布绘图（如线条）模糊
我有一个<div style="border:1px solid border;" />和画布，使用以下方式绘制：
context.lineWidth = 1;
context.strokeStyle = "gray";
绘图看起来很模糊（lineWidth小于1会产生更差的图片），并且在div的边界附近没有任何内容。是否可以使用画布获得与HTML相同的绘图质量？
var ctx = document.getElementById("canvas").getContext("2d");
ctx.lineWidth = 1;
ctx.moveTo(2, 2);
ctx.lineTo(98, 2);
ctx.lineTo(98, 98);
ctx.lineTo(2, 98);
ctx.lineTo(2, 2);
ctx.stroke();
div {
border: 1px solid black;
width: 100px;
height: 100px;
}
canvas, div {background-color: #F5F5F5;}
canvas {border: 1px solid white;display: block;}
<table>
<tr><td>Line on canvas:</td><td>1px border:</td></tr>
<tr><td><canvas id="canvas" width="100" height="100"/></td><td><div> </div></td></tr>
</table>
问题答案：
在画布上绘制线条时，实际上需要跨越像素。我认为这是API中的一个奇怪选择，但易于使用：
代替这个：
context.moveTo(10, 0);
context.lineTo(10, 30);
做这个：
context.moveTo(10.5, 0);
context.lineTo(10.5, 30);
深入了解HTML5的画布一章，就可以很好地讨论这一点（寻找“ ASK PROFESSOR MARKUP”（询问教授标记）框大约在1/4处）
-
我有以下代码应该在图像中绘制线条。我的代码是： 如果我编写，它实际上可以工作。但是我的数组很长并且来自一个输入。
-
我在试着用画布画一个网格。逻辑相当简单：对于网格中的每个节点，我使用其左上角和右下角绘制一个矩形[代码如下]。 我没有做任何奇怪的事情，只是根窗口上的一个简单画布。
-
5.2.3 在画布上绘图 本节介绍如何在画布上绘制图形。为了完整起见，我们将前面介绍过的首先需要执行的 几条语句合在一起复制如下： >>> from Tkinter import * >>> root = Tk() >>> c = Canvas(root,width=300,height=200,bg='white') >>> c.pack() 如前所述，c 是一个画布对象，而画布对象提供了若干
-
我正在用HTML画布做一些工作，我发现当我画了一条线时，我无法清除或画出它？ 所以我要做的是：我有一个带网格的画布，每个单元格在其中绘制自己（一个填充的矩形，在页面加载时完成），当鼠标在网格上时，应该勾勒出鼠标所在的单元格的轮廓（在画布上绘制四条线，没有其他重绘）。当鼠标移动到另一个单元格时，应勾勒出新单元格的轮廓（如前所述），而不应再勾勒出先前勾勒出的单元格的轮廓（目的是重新绘制单元格，绘制线条
-
有没有可能通过它们的方程式在画布中画出曲线呢？如果是，怎么做？假设我有一个数学方程y=0,5*x^2,如何打印方程的图形？ 我尝试使用和方法，但未成功。
-
在画布上画画是非常好的。即使橡皮擦也能工作得很好。问题是当画布保存为图像时，它画的是黑线，而不是橡皮擦。 为了更好地理解，我添加了屏幕、镜头和代码。 1.在擦除图的同时- 我不明白为什么橡皮移动被替换为黑色，而保存画布作为一个图像。