草庐IT

Wxml2Canvas

全部标签

javascript - Firefox 使用 HTML Canvas putImageData 抛出异常

所以我正在做这个小的javascript实验,我需要一个小部件来跟踪它的FPS。我将我一直在使用Actionscript3的小部件移植到Javascript,它似乎可以在Chrome/Safari上正常工作,但在Firefox上会抛出异常。这是实验:DepthofField这是错误:[Exception..."Aninvalidorillegalstringwasspecified"code:"12"nsresult:"0x8053000c(NS_ERROR_DOM_SYNTAX_ERR)"location:"http://mrdoob.com/projects/chromeexper

javascript - 将 Canvas 中的图像保存在 zip 中

我在HTML5中有一个Canvas,它最终可能是一个非常长的数据URL(如果他们尝试导航到它,它的长度足以使chrome崩溃)。因此,我正在尝试使用JSZip将图像保存在zip中。我尝试了以下两件事:varzip=newJSZip();varsavable=newImage();savable.src=canvas.toDataURL();zip.file("image.png",savable,{base64:true});varcontent=zip.generate();varblobLink=document.getElementById('blob');blobLink.do

html - 如何保存 HTML5 Canvas ?

目前我正在使用Canvas2Image保存我的HTML5Canvas的内容。但是,它似乎不适用于GoogleChrome。欢迎任何有关如何解决此问题的想法。:) 最佳答案 canvas.toDataURL()似乎在Chrome中运行良好,因此可能是库问题。不过,“将Canvas转换为图像”功能似乎有效。 关于html-如何保存HTML5Canvas?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/q

html - 如何删除 html5 Canvas 的额外高度?

我正在测试html5canvas元素,并希望我的Canvas在显示区域中全屏显示。但是我发现如果我将Canvas高度设置为window.innerHeight,滚动条就会显示出来。我试过发现需要将高度设置为少5个像素,滚动条就会消失,但不幸的是它在Canvas下方留下了一个白色边框。如果它是一个div元素,一切都很好。我用来测试的代码是:Testfunctionload(){varo=document.getElementById('canvas');if(o){o.width=window.innerWidth;o.height=window.innerHeight-5;}o=doc

javascript - HTML5 Canvas 上的矩形被拉伸(stretch)

我在一个网站上工作,我尝试使用javascript在HTML5Canvas上获取矩形。通常这没有问题,但现在当我制作一个宽度和高度为10的矩形时。它似乎制作了一个宽度为10和高度为20的矩形。我正在制作这样的矩形:varcanvas=$("#canvas");varcontext=canvas.get(0).getContext("2d");context.fillRect(0,0,10,10);divCanvas的宽度设置为100%,但我试图给它一个固定的宽度,但这也没有帮助。 最佳答案 您需要在Canvas元素上设置宽度和高度,

javascript - 在 JavaScript Canvas 上混合两个图像

如何混合两个像素数据阵列来创建一个图像?可以选择使用不同的混合模式? 最佳答案 Pixastic是一个高级使用Canvas的特殊框架,这里有混合示例:http://www.pixastic.com/lib/docs/actions/blend/如果您想单独执行此操作,您可以从2张图像中提取像素数据,将其与数学方程混合,然后放入Canvas中。以下是如何从/向Canvas获取和放置像素数据的信息:http://ajaxian.com/archives/canvas-image-data-optimization-tip更新:以50-5

javascript - 如何重置 Canvas 上下文的比例?

我有一个变量context,它是我的Canvas的2d上下文。varcanvas=document.getElementById('canvas');context=canvas.getContext('2d');多次调用context.scale(x,y)会根据之前的缩放比例缩放上下文。例如,context.scale(2,2);context.scale(2,2)等同于context.scale(4,4)。如何重置上下文的比例? 最佳答案 scale会将当前变换矩阵乘以缩放矩阵,因此实际上,这些缩放因子相乘。您可以使用状态堆栈来

javascript - Canvas 上的 HTML?

谁能解决我的一些困惑。是否可以在Canvas顶部放置html?我一直读到你不能有GUI元素,例如JquerywithCanvas,但后来我读到你可以在Canvas上有HTML,为什么你可以有一个而不是另一个?我理想中最终想要的是在我的Canvas顶部有一个好的GUI,所以只需要知道什么是可能的,什么不是。 最佳答案 当然-您可以使用绝对定位将HTML放在Canvas的“顶部”。http://jsfiddle.net/stevendwood/5sSWj/您不能在Canvas中使用HTML。但是假设Canvas和HTML使用相同的坐标,

javascript - HTML5 - Canvas ,drawImage() 绘制图像模糊

我正在尝试将以下图像绘制到Canvas上,但尽管定义了Canvas的大小,它还是显得模糊。如下图所示,图像清晰明了,而在Canvas上则模糊且像素化。这是它的外观(左边是原图,右边是画在Canvas上的模糊图像。)我做错了什么?console.log('Helloworld')varc=document.getElementById('canvas')varctx=c.getContext('2d')varplayerImg=newImage()//http://i.imgur.com/ruZv0dl.pngseesaCLEAR,CRISPimageplayerImg.src='htt

php - 我应该为 HTML5 和 <canvas> 放弃 Adob​​e Flash 吗?

我目前正在研究开发Facebook应用程序,并计划使用Flash作为我的应用程序的基础,我已经测试构建了一些简单的PHPFacebook应用程序,并且我对action-script3有足够的了解,可以开始我的工作,但是在AS中用于Facebook开发的API看起来比PHP乏味得多。我的问题是我能否像在HTML5canvas类中看到的那样创建交互式图形(游戏)?哪个更简单? 最佳答案 除了各种浏览器的基本支持之外,HTML5还没有真正存在。我们距离真正的饱和还有几年的时间,因为直到IE9和FF4发布并被广泛采用。您可以使用Google