为什么尺寸较大的 HTML5 Canvas 会拉伸绘制的线条?
我正在使用 HTML5 来绘制线条。
当我将尺寸从默认的 300x150 更改为匹配另一个
的尺寸时,我的线条显得被拉伸并且比以前更粗。为什么会发生这种情况?我想在画布上绘制线条以匹配其前面的
上的元素位置(具有更高的 z-index
)页面上的相同位置。我怎样才能阻止这种拉伸的发生?编辑:这似乎仅适用于 Firefox。
I am using a HTML5 <canvas>
to draw lines on.
When I change the dimensions from the default of 300x150 to match the dimensions of another <div>
my lines appear stretched and are thicker than before. Why is this happening?
I want to draw the lines on the canvas to match the position of elements on the <div>
that is in front of it (with a higher z-index
) in the same position on the page. How can I stop this stretching from happening?
EDIT: This appears only to be in Firefox.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您无法使用 CSS 更改画布大小。如果你这样做,它会表现得像一个图像,并且会拉伸你必须在 javascript 中使用画布属性 canvas.width、canvas.height 来完成它
You can't change canvas size with CSS. If you do it will behave like an image and it will stretch You have to do it in javascript with canvas properties canvas.width, canvas.height