javascript - HTML5 画布：透视文本

Question

我正在尝试将我的第一个游戏创建为 HTML5。我搜索了几个小时，比如留下一个文本 persperctiva（用于画布）。

见附件我需要什么。是否需要将文本中的两个“点”修改为我需要的效果。图片：https ://pbs.twimg.com/media/BVbuU1PCUAA7d8a.png

PS：我设法只留下文字“旋转”（基本），这不符合我的目的。

我发现的所有主题都是不可能的。

score 1 · Accepted Answer

Canvas 的 2d 上下文无法执行链接中显示的非并行转换。

要进行类似透视的变形，您需要使用画布 3d 上下文 (webGL)。

或者，这是一篇关于如何将像素从原始三角形插入到扭曲三角形的帖子：

这将允许您“手动”在 2d 上下文中进行透视变形。

score 0 · Accepted Answer

看起来并没有涉及太多视角，因此您可能会通过一个简单的偏差而逃脱：

var angle = -0.2;
context.setTransform(1, 0, angle, 1, 0, 0);
context.drawImage(img, 100, 0, 350, 100);

2 回答 2