当前位置: 首页 > 面试题库 >

如何在HTML5画布上绘制多边形?

柴亦
2023-03-14
问题内容

我需要知道如何在画布上绘制多边形。不使用jQuery或类似的东西。


问题答案:

使用moveTo和创建一个路径lineTo

var ctx = canvas.getContext('2d');
ctx.fillStyle = '#f00';
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(100,50);
ctx.lineTo(50, 100);
ctx.lineTo(0, 90);
ctx.closePath();
ctx.fill();


 类似资料:
  • 我想用javascript在响应画布上画一个圆圈。我得到了画布的宽度和高度,但由于div标签的宽度和高度%,我能够正确地画出圆圈。div标记的宽度和高度以%为单位,因为我想在单个页面上显示5个画布。是否有其他方法可以在一页上放置5块画布,并使用画布的高度和宽度在每个画布上画一个圆圈?还有一件事,我不想要绝对位置,因为根据浏览器的宽度,我想要改变画布的位置 图片:192.168。10.29/1.巴布

  • 实际上,我可以使用函数来完成。我从“HTML5画布-如何在图像背景上画一条线?”中得到的东西。但是我需要在不使用from函数的情况下绘制图像,如下所示:

  • 我想在画布上画一段视频。为了实现这一点,我在Javascript中捕获onMouseDown和onMouseUp事件,以获得每个事件的x和y坐标(我需要在画布中设置视频的位置、宽度和高度)。 因此,每次我在画布上绘制视频时,我创建的上一个视频都应该停止,并且必须播放新的视频。两个问题: 1)视频不播放(功能只画第一帧),但他的音频可以 2) 如何停止以前绘制的视频? 演示:http://jsfid

  • 问题内容: 是否有将SVG文件绘制到HTML5画布上的默认方法?GoogleChrome支持将SVG加载为图像(并简单地使用),但是开发者控制台会对此进行警告。 我知道将SVG转换为canvas命令的可能性,但是我希望这不是必需的。我不在乎较旧的浏览器(因此,如果FireFox 4和IE 9支持某些功能,那就足够了)。 问题答案: 编辑2019年12月16日 现在所有主要浏览器都支持Path2D

  • 问题内容: 似乎没有绘制椭圆形形状的本机功能。我也不是在寻找蛋形。 是否可以绘制具有2个贝塞尔曲线的椭圆形?有人遇到过吗? 我的目的是画一些眼睛,实际上我只是使用弧线。提前致谢。 解 因此,scale()更改所有下一个形状的缩放比例。Save()之前保存设置,还原用于还原设置以绘制新形状而无需缩放。 感谢Jani 问题答案: 更新: 缩放方法可能会影响笔触宽度的外观 正确的缩放方法可以保持笔画宽度

  • 我编写了这段代码,可以在JavaFX画布上绘制。它可以很好地工作,但我不知道如何重新绘制画布(比如在Swing中),以便在新画布上重新开始绘制。这是我的代码,非常感谢你的帮助!马里奥