Javascript 有没有一种更简单（而且性能更好）的方法可以通过最近邻重采样提高画布渲染的比例？

对于以最近邻格式放大画布渲染这一看似简单的任务，我有点困惑，我在这里问：

目标是转换三维渲染输出，如下所示：

要创建这样的像素艺术：

---

但在这个问题中，我要问的是如何实现我选择的解决方案，基本上使用着色器来正确处理放大。也许相反，我应该问：有没有一种更简单、性能更好的方法可以做到这一点？

我可以提供两种方法，都可以使用最近邻有效地上下缩放图像

要手动执行此操作，您应该迭代新缩放图像的每个像素，并使用旧尺寸与新尺寸的比率计算原始图像中的哪个像素应该使用

我的代码段使用.toDataURL，因此它们可能无法在chrome中工作

输入{ 显示：无； } 身体{ 背景色：黑色； } 正文>*{ 显示：块； 边缘顶部：10px； 左边距：自动； 右边距：自动； } img{ 背景颜色：灰色； 边框：纯色1px白色； 边界半径：10px； 图像渲染：优化速度； } 标签{ 过渡：0.1s； 光标：指针； 文本对齐：居中； 字体大小：15px； -webkit触摸标注：无； -webkit用户选择：无； -khtml用户选择：无； -moz用户选择：无； -ms用户选择：无； 用户选择：无； 宽度：130px； 高度：40px； 线高：40px； 边界半径：10px； 颜色：白色； 背景色：005500； 盒影：0px 4px 555555； } 标签：悬停{ 背景色：007700； } 标签：活动{ 盒影：0px 1px 555555； 转换：translateY3px； } 剧本{ 显示：无； }

---

这是使用webGL的代码，我的意思是，循环版本的性能不够实时，可能更好，但它并不简单，老实说，它太复杂了，如果没有简化的库的帮助，我目前在渲染/webGL none方面的经验对我来说太复杂了。我对这一出色的工作投了赞成票，但当我看到这段代码时，我有点眉飞色舞。当我要求更简单时，我想做一些事情，比如渲染到画布，禁用反别名，并使用变换或类似的奇怪方式放大画布。WebGL涉及到一些锅炉板，但如果您关心的是速度，那么在web上，目前不可能有比硬件支持的纹理缩放更快的东西。我能做的就是提供一个模块，使它更易于使用。假设您为它提供了一直在绘制的低分辨率画布、另一个用于放置缩放图像的画布以及一个用于缩放的因子。