草庐IT

Canvas-EventSystem-Panel

全部标签

android - Canvas 上的鼠标单击(或触摸)事件导致使用 HTML5、Phonegap 和 Android 进行选择

我正在使用easlejs+phonegap开发一个HTML5游戏,我遇到了一个问题,即每次您在Canvas上单击/触摸/按下鼠标时屏幕都会闪烁。下面是我创建的非常简单的代码来测试这个问题,看看它是否与easlejs相关。从代码中可以看出,这与easlejs无关,只是html5/phonegap问题。你可以看到我也尝试过不选择CSS样式,但没有成功。#canvas{user-select:none;-webkit-user-select:none;-moz-user-select:none;}varcanvas=document.getElementById("canvas");canv

android - Canvas 上的鼠标单击(或触摸)事件导致使用 HTML5、Phonegap 和 Android 进行选择

我正在使用easlejs+phonegap开发一个HTML5游戏,我遇到了一个问题,即每次您在Canvas上单击/触摸/按下鼠标时屏幕都会闪烁。下面是我创建的非常简单的代码来测试这个问题,看看它是否与easlejs相关。从代码中可以看出,这与easlejs无关,只是html5/phonegap问题。你可以看到我也尝试过不选择CSS样式,但没有成功。#canvas{user-select:none;-webkit-user-select:none;-moz-user-select:none;}varcanvas=document.getElementById("canvas");canv

javascript - HTML Canvas - 绘图在调整大小时消失

我在HTMLcanvas元素中创建了一个基本形状,效果很好。当我调整Canvas大小时出现问题,Canvas中的所有绘图都消失了。这是正常行为吗?或者是否有可用于停止此功能的功能?解决此问题的一种方法是在调整Canvas大小时再次调用绘图函数,但是如果要绘制的内容很大,这可能不是很有效。什么是最好的方法?这里是示例代码的链接https://gist.github.com/2983915 最佳答案 调整大小时需要重新绘制场景。设置Canvas的宽度或高度,即使您将其设置为与之前相同的值,不仅会清除Canvas,还会重置整个Canvas

javascript - HTML Canvas - 绘图在调整大小时消失

我在HTMLcanvas元素中创建了一个基本形状,效果很好。当我调整Canvas大小时出现问题,Canvas中的所有绘图都消失了。这是正常行为吗?或者是否有可用于停止此功能的功能?解决此问题的一种方法是在调整Canvas大小时再次调用绘图函数,但是如果要绘制的内容很大,这可能不是很有效。什么是最好的方法?这里是示例代码的链接https://gist.github.com/2983915 最佳答案 调整大小时需要重新绘制场景。设置Canvas的宽度或高度,即使您将其设置为与之前相同的值,不仅会清除Canvas,还会重置整个Canvas

javascript - clearRect 绘制垂直线时不清除 Canvas

我在工作中遇到了一个用Canvas构建东西的奇怪边缘案例。clearRect在绘制从Canvas顶部到底部的垂直线时不会清除Canvas。渲染其他东西时,clearRect工作正常。我不确定我是否遗漏了一些明显的东西,这是故意行为还是浏览器错误(不太可能,因为mac上的chrome、safari、firefox和opera中的行为是相同的)。如果是故意行为,是否有人知道其背后的基本原理和/或可以指出一些文档?我做了一个小测试用例,清楚地显示了行为,只有组合clearRect/verticallines不清除Canvas:http://jsfiddle.net/kZj6F/谢谢!

javascript - clearRect 绘制垂直线时不清除 Canvas

我在工作中遇到了一个用Canvas构建东西的奇怪边缘案例。clearRect在绘制从Canvas顶部到底部的垂直线时不会清除Canvas。渲染其他东西时,clearRect工作正常。我不确定我是否遗漏了一些明显的东西,这是故意行为还是浏览器错误(不太可能,因为mac上的chrome、safari、firefox和opera中的行为是相同的)。如果是故意行为,是否有人知道其背后的基本原理和/或可以指出一些文档?我做了一个小测试用例,清楚地显示了行为,只有组合clearRect/verticallines不清除Canvas:http://jsfiddle.net/kZj6F/谢谢!

javascript - 根据所选选项更改 Canvas 的尺寸

我在Canvas上工作时遇到了改变立方体尺寸的想法。因此,通过使用HTML5Canvas,我制作了这个立方体,它有两个由线条连接的正方形,使它看起来像一个立方体。我想要的是,当我从select中选择立方体类型时,立方体应该根据所选选项的长度和宽度自动更改。高度保持不变。就像如果我选择5x5的立方体,默认情况下它是一个立方体,但是当我选择5x10的选项时,宽度(正面)不应更改,但立方体的长度(边)应该扩展,反之亦然,如果我选择10x5我的最大选项是25x15。如您所见,我在下面创建的Canvas以像素为单位,首先我需要将这些像素转换为厘米(cm),然后将厘米转换为立方米。整个立方体应该在

javascript - 根据所选选项更改 Canvas 的尺寸

我在Canvas上工作时遇到了改变立方体尺寸的想法。因此,通过使用HTML5Canvas,我制作了这个立方体,它有两个由线条连接的正方形,使它看起来像一个立方体。我想要的是,当我从select中选择立方体类型时,立方体应该根据所选选项的长度和宽度自动更改。高度保持不变。就像如果我选择5x5的立方体,默认情况下它是一个立方体,但是当我选择5x10的选项时,宽度(正面)不应更改,但立方体的长度(边)应该扩展,反之亦然,如果我选择10x5我的最大选项是25x15。如您所见,我在下面创建的Canvas以像素为单位,首先我需要将这些像素转换为厘米(cm),然后将厘米转换为立方米。整个立方体应该在

javascript - 如何在 html5 和 javascript 中编辑像素并删除 Canvas 图像中的白色背景

如果我加载图像,我如何遍历其所有像素并将白色像素(或我指定的任何颜色)变为透明?我有一个关于如何做到这一点的想法,但循环过程应该像一个二维数组,所以它会涉及两个for循环。我想我会从顶行的第一个像素开始,向右迭代,如果它是白色像素,那么我将它变成透明的,然后向右移动1个像素,如果它不是白色的,然后我停止。然后在同一行,我从最左边的像素开始,检查,如果是白色,我把它变成透明的,然后向左移动1个像素,等等......然后我向下移动1行并重复整个过程..这样我就不会删除实际图像中的任何白色像素。 最佳答案 使用getImageData和p

javascript - 如何在 html5 和 javascript 中编辑像素并删除 Canvas 图像中的白色背景

如果我加载图像,我如何遍历其所有像素并将白色像素(或我指定的任何颜色)变为透明?我有一个关于如何做到这一点的想法,但循环过程应该像一个二维数组,所以它会涉及两个for循环。我想我会从顶行的第一个像素开始,向右迭代,如果它是白色像素,那么我将它变成透明的,然后向右移动1个像素,如果它不是白色的,然后我停止。然后在同一行,我从最左边的像素开始,检查,如果是白色,我把它变成透明的,然后向左移动1个像素,等等......然后我向下移动1行并重复整个过程..这样我就不会删除实际图像中的任何白色像素。 最佳答案 使用getImageData和p