canvas-png-compression
全部标签 我最近创建了一个HTML5Canvas动画(也使用Processing.js)。问题是当我将浏览器切换到不同的选项卡时,动画停止播放。当用户位于与包含动画的标签不同的标签时,如何让动画继续播放?例子:http://jsfiddle.net/EyFTr/3/如果您切换标签页,时钟会停止,但如果您打开一个新窗口的链接并模糊该窗口,时钟仍会移动。 最佳答案 简短的回答是你不能。https://developer.mozilla.org/en/DOM/window.setTimeoutIn(Firefox5.0/Thunderbird5.0
我正在关注这个this能够在我的javascript/canvas游戏中加载由平铺map编辑器创建的jsonmap文件的教程。我已经实现了我自己的版本,并且在控制台或网络等中的firebug中没有出现任何错误。据我所知,通过放入console.logs和警报,脚本运行得非常好!问题是Canvas保持空白!当它现在应该有一个tilemap时。这是我在游戏中实现的教程版本:functionLevel(){varc;vardata;varlayers=[];this.get_map=function(name,ctx){c=ctx;$.getJSON('maps/'+name+'.json'
我正在构建一个有趣的Chrome实验。mustache镜子!http://sjoerddijkstra.nl/cam/我想使用ImgurAPIV3将图像从tecanvas上传到Imgur,然后显示链接,但我真的不知道该怎么做。我找到的所有工作示例都使用V2API...我使用canvas.toDataURL:vardataURL=canvas.toDataURL("image/png");returndataURL.replace(/^data:image\/(png|jpg);base64,/,""); 最佳答案 Imgur文档在I
我使用addonsdk创建了一个Firefox插件.我正在尝试使用canvasdrawWindow功能。我有以下代码来使用该函数,其中ctx指的是我通过canvas.getContext("2d")获得的Canvas上下文。ctx.drawWindow(window,0,0,100,200,"rgb(255,255,255)");当我运行此代码时,在使用附加的脚本中tabs.activeTab.attach({contentScriptFile:data.url("app.js")//app.jscontainstheabovelineofcode});我收到以下错误:TypeErro
我假设使用HTML5中的所有这些硬件加速动画,实际上不会渲染在视口(viewport)之外运行的动画。我希望能够检测到是否正在发生。我尝试在每秒移动100px的对象上循环使用webkitCSSMatrix来尝试确定每个刻度线移动了多少像素,但是如果我将动画移出视线则没有区别。有任何想法吗? 最佳答案 您可以使用单独的计时器测试来查看伪经验方面在外部和内部绘制的对象之间的差异(计时器实际上并不能证明任何东西,但可以为您提供强大的indisium)。但是,了解Canvas的工作原理也可以为您提供坚实的指导。例如,Canvas是一个简单的
我有一个任务需要在我的网页上加载URL(e.g.yahoo.com)并截取屏幕截图。我正在使用html2canvas截图并将其附加到页面正文。URL指定的页面已成功加载到div元素内的iframe中。但是当我尝试对其进行截图时,iframe区域变为空白。下面是previewURL和screenshot的代码。//topreviewtheURLcontentfunctionpreviewUrl(url,target){//usetimeoutcozmousehoverfiresseveraltimesclearTimeout(window.ht);window.ht=setTimeout
我正在绘制一个未被清除的Canvas,并使Canvas随着时间的推移逐渐变成纯色,或者在alpha中逐渐消失以显示后面的图层。我的第一直觉是简单地用每帧的低alpha在绘图上填充一个矩形,这样填充颜色就会逐渐累积并淡出绘图。但我发现了一些奇怪的行为(至少对我来说,我确信这是有原因的)。填充颜色永远不会完全累积。结果会根据油漆和填充颜色是否比彼此更亮/更暗而变化。我发现这个问题有人和我做同样的事情:fadeoutlinesafterdrawingcanvas?顶部的答案看起来不错,和我试过的一样。但它只适用于白底黑字。这是同一个fiddle的不同颜色的另一个版本,你会看到绘图永远不会
有没有一种快速有效的方法可以在canvas中移动大量对象?基本上,如果有大约1000个对象,并且我想一次移动所有对象以模拟滚动,则通过调用drawImage()1000多次来重绘每个对象会非常慢。有没有办法优化这个?我有一个问题的示例链接(而且只有100个对象):http://craftyjs.com/isometric/ 最佳答案 由于canvas不提供快速低级位图复制,因此很难在多个图层中执行操作,例如一次滚动整个背景然后只渲染边缘。那你能做什么?简而言之,什么都没有。尤其是在滚动时,当你有一个或多或少的静态背景时,你肯定可以用
我们有一个多年前在Flash中开发的测验,它使用点击区域来确定是否有人点击了图像的适当部分(想想“解剖测验”)。这些命中区域的轮廓非常繁琐,无法重复使用轮廓坐标数据...现在,我们正尝试用HTML重新做这件事--所以,我们有一个股骨的背景图像和一个png,它在Z顺序中位于更高的位置,其中一部分完全透明,而其他部分有50%的灰色。这用于告诉学生背景股骨图像上的什么地方。我希望能够在“测验模式”中使用来自该pngmask层的数据来确定学生是否正确点击了股骨的特定部分...我正在考虑设置maskpng到100%透明度(因此学生看不到它),但如果浏览器知道他们点击了图像的正确区域(即蒙版上10
我非常了解HTML5Canvas,我了解使用循环等的基础知识和动画。我正在使用的演示:(单击以制作形状)http://henry.brown.name/experiments/box2d/example-canvas.html我不太熟悉的是Box2D。我正在使用Box2DWeb端口,听说它比Box2D-js更新,我不确定哪个最好。我知道如何初始化“世界”并且我可以在世界中放置对象。然后,我使用Step为世界设置动画-但是到目前为止,为了在屏幕上显示它,我只能使用debugdraw来让它工作,因为它基本上会为你做所有事情。我不想使用调试绘图,而是使用Canvas来绘制,例如一辆汽车,而不