黑马程序员技术交流社区

标题: 关于canvas绘图在浏览器中拉伸的问题 [打印本页]

---

作者: 南国之南    时间: 2016-7-8 22:50
标题: 关于canvas绘图在浏览器中拉伸的问题
昨天简单学了canvas绘图的课程，觉得有一些还是有必要大家分享的

然后的话遇到一个 问题，就是在JS代码中设置的图形到了浏览器中总是被拉伸，下面是我找到的解决方案：

图形在浏览器中被拉伸的原因是css样式在浏览器中会跟JS代码中的设置有出入，就会被拉伸（我也看得是云里雾里的），所以我们除了在css样式中设定canvas画布的样式

<canvas id="canvas" style="width:500px;height:500px"></canvas>

还要在js代码中设置，类似下面这个

context.width=500;
context.height=500;

这样的话就能够解决拉伸的问题了

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2