草庐IT

canvas2image

全部标签

javascript - 向 Canvas 对象添加新上下文

我正在用javascript创建一个库,我想知道是否有某种方法可以将新型上下文而不是2d添加到Canvasvarctx.document.getElementById('canvas').getContext("othercontext");我将在其中创建一个包含所有普通2d属性以及更多其他属性的othercontext。有什么办法吗? 最佳答案 您不能完全做到这一点,但您可以HookgetContext方法并返回具有额外属性和方法的扩展2D上下文:(function(){//savetheoldgetContextfunction

javascript - 在 Firefox 中检测到 "image corrupt or truncated"

(先发制人:如果您想将此标记为重复项,请注意其他问题似乎在问“为什么我会收到此错误?”我知道为什么会收到此错误;我想知道如何检测我的JavaScript代码中的错误。它只出现在Firebug控制台中,当然,在加载图像时对用户来说是显而易见的。)我正在使用picturefill对于响应图像。我有一个为图像上的加载事件触发的回调。因此,每当有人调整浏览器窗口大小时,回调就会运行,以便通过picturefill加载不同的图像。在回调中,我通过Canvas将图像数据转换为dataURL,这样我就可以将图像数据缓存在localStorage中,以便用户即使在离线时也可以使用。注意关于“离线”的部

javascript - 如何在 IE 11 的 Image.load 上获取 SVG 的宽度和高度

它在任何地方都可以正常工作,但在IE11中不行(我还没有测试过其他IE版本)。varimg=newImage();img.onload=function(){alert('img:'+img.width+'x'+img.height+'natural:'+img.naturalWidth+'x'+img.naturalHeight);};img.src='http://upload.wikimedia.org/wikipedia/en/b/b5/Boeing-Logo.svg';JSFiddle:JSFiddle结果:img:121x30natural:121x30-真正的浏览器(Ch

javascript - 强大的 JavaScript Canvas 库

按照目前的情况,这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visitthehelpcenter指导。关闭10年前。作为一个简单的javascript库,我们有非常强大的jquery。但我想知道在可用性、灵active和通用性方面有哪些强大的Canvas库。我发现Raphael非常有趣,但我发现它的影响较小。因此,我正在寻找一个具有大量动画效果并可灵活处理SVG和Canvas元素的Canvas库。

javascript - HTML Canvas 间隔与 RequestAnimationFrame

所以,也许这里完全是脑残。setInterval()的语法非常清晰。每x毫秒做一些事情。如何最好地将其转换为使用requestAnimationFrame()?我有大约300个对象,每个对象都应该以特定的时间间隔(每8、6、2等秒)执行一个动画序列?我怎样才能最好地使用每秒被调用60次的requestAnimationFrame()来完成这个任务?可能有一个简单的答案,我只是,对于我的生活,无法弄清楚。 最佳答案 要强制requestAnimationFrame坚持特定的FPS,您可以同时使用两者!varfps=15;functio

javascript - Angular http : how to call images with custom headers?

在htmlView中,图片是这样显示的:element.image.url指向一个url,如:/rest_api/img/12345678。这工作正常,显示图像。现在,我添加身份验证:在用户通过身份验证之前,每个资源都会响应HTTP错误401,图像也是如此。当身份验证成功时,token将放置在自定义header中并随每个$http请求一起发送,从而允许访问资源:$http.defaults.headers.common['Authorization']=token;这对于加载了$resource的Json文件工作正常。但图片的直接链接在认证后仍然是401。如何调用带有自定义标题的图片?

javascript - MediaStream 同时捕获 Canvas 和音频

我正在从事一个项目,我想:加载视频js并将其显示在Canvas上。使用滤镜改变Canvas(以及视频)的外观。使用MediaStreamcaptureStream()方法和MediaRecorder对象记录Canvas表面和原始视频的音频。在HTML视频元素中播放Canvas和音频流。通过调整以下WebRTC演示代码,我已经能够在视频元素中显示Canvas记录:https://webrtc.github.io/samples/src/content/capture/canvas-record/就是说,我不知道如何在Canvas旁边录制视频的音频。是否可以创建一个包含来自两个不同源/元素

javascript - 如何将焦点设置到 HTML5 canvas 元素?

我正在使用HTML5元素在Firefox2.0.0.16和Safari3.1.2中,都在我的iMac上。(我也在Windows上的Firefox3.0中尝试过这个,但也无济于事。)标签看起来像这样:我有一个按钮可以“激活”一些与Canvas交互的功能。那个按钮的onclick()事件调用函数。在该函数中,我有以下行:document.getElementById("display").focus();这是行不通的。Firebug报告没有错误。但焦点仍然在原来的地方。我可以单击Canvas或指向Canvas的选项卡,焦点将从其他元素丢失,但显然Canvas永远不会获得焦点(Canvas的

javascript - 是否可以让鼠标事件通过 Canvas 层?

我有一个图像网格和它上面的Canvas层,我想在用户滚动网格中的缩略图图像时在Canvas标签上做一些动画,所以我想知道是否可以让鼠标事件通过Canvas层? 最佳答案 在Canvas上试试这个css属性:pointer-events:nonehttp://dev.w3.org/csswg/css3-ui/#pointer-events它旨在阻止元素接收任何鼠标事件。Mozilla似乎相信事件会像您希望的那样传递到它背后的元素。https://developer.mozilla.org/en/CSS/pointer-events看起

javascript - HTML 5 Canvas 中的一手拉圆模拟

followingcode使用jQuery在HTML5Canvas中创建一个圆圈:代码://getareferencetothecanvasvarctx=$('#canvas')[0].getContext("2d");DrawCircle(75,75,20);//drawacirclefunctionDrawCircle(x,y,radius){ctx.beginPath();ctx.arc(x,y,radius,0,Math.PI*2,true);ctx.fillStyle='transparent';ctx.lineWidth=2;ctx.strokeStyle='#003300