在onmouseover和onmouseout上更新Canvas内容 [英] Updating Canvas content on onmouseover and onmouseout

问题描述

我正在使用HTML5创建游戏，在我的工作中，我通常基于onmouseover和onmouseout更新画布内容。
on onmouseover我这样做

I'm working on creating a game using HTML5 and in my work i'm usually update canvas content based on onmouseover and onmouseout . on onmouseover i'm doing that

                    cxt.beginPath();
                    cxt.moveTo(10, 10);
                    cxt.lineTo(40, 40);
                    cxt.moveTo(40, 10);
                    cxt.lineTo(10, 40);
                    cxt.stroke();
                    cxt.closePath();
                    content[canvasNumber - 1] = 'Value';

现在onmouseout事件我想清除画布的内容，而不覆盖当前内容！ ，

now and on onmouseout event i want to clear the content of that canvas without overriding the current content !!, how can i do that ?!

推荐答案

我想我知道你的意思，但你必须更加小心与您的语言。您说：

I think I know what you mean, but you have to be a little more careful with your language. You say:

不覆盖当前内容！

without overriding the current content !!

但是你刚刚画的是当前内容！我想你真正的意思是不清除之前的内容。

But the X you just drew is current content! I think what you really meant to say was "without clearing the content that was there before".

当然，我们总是尽力回答你的问题，但是请尝试非常努力地使用确切和仔细的语言，当问他们。英语可能不是你的第一语言，你可能说得比我说我的第二语言更好，但即使你不确定的话，即使你必须说几个不同的方式，同样的事情，更多的语言是值得的，只是为了确保我们的理解。

Of course we'll always try our hardest to answer your questions, but please try very hard to use exact and careful language when asking them. English might not be your first language, and you probably speak it better than I speak my second language, but even if you're not sure of the words, even if you have to say the same thing in a few different ways, more language is worth it just to be sure we understand.

谢谢！

如果要清除X而不覆盖之前的内容，保存之前的内容。

If you want to clear the X without overriding the content that was there before, you have to save the content that was there before.

要保存画布位图，我们可以使用所谓的内存画布或画外画布。您可以使用 document.createElement 并且不要将它们添加到DOM

To save a canvas bitmap we can use what's called an "in-memory canvas" or "offscreen canvas." You make these by using document.createElement and never adding them to the DOM

发生 mouseover 时恢复位图; mouseout 发生时：

Here's a code example of saving the bitmap when mouseover occurs and restoring that bitmap when mouseout occurs:

http://jsfiddle.net/simonsarris/uRXeN/

这篇关于在onmouseover和onmouseout上更新Canvas内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！