我正在用javascript构建一个简单的游戏引擎，并且当前正在为左右动画构建单独的Spritesheets，但这似乎有点痛苦...我想做的是这样的： 

function loadSprite(graphic)
{    
   var left_graphic = graphic;
   var right_graphic = graphic.flip();  //Create a flipped copy of the graphic
}

// [...]

function update()
{
   if(speed>0) context.drawImage(left_graphic);
   if(speed<0) context.drawImage(right_graphic);
}

为了澄清起见，我想创建一个Image（）对象的副本，然后镜像翻转所有像素，因此不必维护两个Spritesheet。

可能吗？

===============>>#1 票数：0 已采纳

首先，您可以使用此处描述的方法复制像素数据：使用JavaScript获取图像数据？

我假设您使用的是带有固定大小图像的Sprite表。 然后，您必须编写一种算法来翻转图像表中的每个图像： 

for each image in the sheet:
  calculate sheet offset (xOffset, yOffset)
  for each pixel in half the image:
    read pixel ((x, y) + (xOffset, yOffset))
    read opposite pixel ((width - x, y) + (xOffset, yOffset))
    write on top of opposite pixel
    write opposite pixel on top of current pixel

  ask by Loupax translate from so

未解决问题？本站智能推荐：

1回复

Webgl / Javascript：将画布纹理内容复制到另一个上下文纹理对象

我试图将我的第一个webgl上下文的内容（图像显示）复制到另一个webgl上下文的纹理中。 我正在将texImage2D函数与canvas元素作为源一起使用，没有收到任何错误，但它仅呈现黑色。 我不知道自己缺少什么，因此非常感谢您提供任何帮助。 我正在寻找一个webgl1解决方案，并使用C
2回复

使用javascript给图像对象设置高度不起作用

我正在尝试使用javascript赋予图像对象高度，但是它不起作用。 HTML代码 我想使用JavaScript创建背景图片，并且必须根据画布大小设置此图片。 JavaScript代码： 我可以看到该图像，但无法在运行时给出该图像的高度和宽度。 如何在运行时给出图像对
1回复

如何使用Konva.js将图像复制/粘贴到另一个图像？

我正在构建与《俄罗斯方块》类似的游戏，但其块可以平滑移动（逐像素）。 现在，我为每个新块创建一个单独的Konva Image对象： 屏幕上有很多块，我注意到动画略有变慢。 现在，我想尝试将所有固定的块放入1个大的Image对象中，以查看这样做是否更快。 Konva是否可以将
1回复

Javascript对象未将图像设置为数组

我正在开发HTML5游戏，并且具有一个应加载图像并将其附加到数组以供以后显示在画布上的函数。 加载功能的代码在这里... 保持数组的代码在这里... 渲染代码在这里... 我希望这将尝试加载图像集，并且每次都会增加计数器。 然后，当图像加载时，它将增加加载的计数器，然
1回复

当对象与javascript画布中的另一个对象碰撞时如何停止

OK，所以我正在使用HTML5制作Pacman游戏。 问题是，每当我击中一个砖块时，我都希望精灵停止移动，但它会一直移动直到撞到最左边的砖块对象。 我该如何解决？ 请帮助...这是我用来停止精灵运行的代码。 这是我的所有代码，如果您有时间，请解析它，然后告诉我我做错了什么。
1回复

javascript数组的第一个图像未显示在画布上

我在使用Javacript时遇到了一个小问题。 我的脚本中有一个图像源数组，我想在用户输入时一个接一个地显示。 问题是，当我第一次单击“开始”按钮（我为其提供EventListener的document.getElementById（“ toStart”））时，画布上没有任何显示。 但
1回复

使用javascript中的mousemove事件在画布内的图像上绘制一个矩形

我试图在使用mousemove事件的画布内的图像上绘制一个矩形。 但由于clearRect，我在图像上得到矩形，颜色填充在矩形中。 谁能让我知道 如何在图像上绘制一个只有边框的矩形。 下面是我实现它的代码。 var canvas = document.getElement
1回复

用JavaScript保存图像

我有一个HTML页面，从设备相机获取视频供稿。 我将其绘制到具有setTimeOut循环的画布上，并为图像拍摄图片。 然后，将过滤器应用于该图像（棕褐色，灰度...）并保存。 图像不带过滤器保存。 为什么不保存过滤的图像，而是保存“原始”图像？ 我不太擅长Javascript，所以请保
1回复

实验JavaScript中的对象

几天前，我开始在Codecademy上学习JavaScript，并以Lost Decade的Simple Canvas Game为基础，我想知道：如何添加多个敌人？ 我知道这是有可能的，但是要使其正常工作一直很困难。 这是我破坏所有内容之前的代码。 编辑：我已将运动添加到一个怪物，
1回复

用JavaScript显示图像

我试图使剪贴画图像出现在JavaScript的画布内，由于某种原因，剪贴画没有出现在矩形的上方，因此我正在为其绘制边框，而且我不知道如何使它们都出现。 矩形只显示而不是图片。 我不能把两者都放在画布上吗？ 我需要两个画布吗？ 我只是编码不正确吗？ 任何帮助将非常感激。