草庐IT

canvas-wrapper-with-gettransform

全部标签

javascript - 是否可以将 Proxy 与 native 浏览器对象(HTMLElement、Canvas2DRenderingContext 等)一起使用?

我试图完成的事情。我想共享一个Canvas(因为我正在做的事情很重)所以我想我会做一个有限的资源管理器。您会通过promise向它请求资源,在本例中为Canvas2DRenderingContext。它将上下文包装在一个可撤销的代理中。完成后,您需要调用release,这既会将Canvas返回给有限的资源管理器,这样它就可以将它交给其他人,并且它会撤销代理,这样用户就不会意外地再次使用该资源。除非我制作Canvas2DRenderingContext的代理失败。constctx=document.createElement('canvas').getContext('2d');cons

javascript - Angular 2 : How to use css calc() with some component value?

我想使用calcCSS函数根据组件值计算div高度。它给我的错误:TypeError:co.calcisnotafunction我的代码: 最佳答案 您的语法不正确。正确的方法是: 关于javascript-Angular2:Howtousecsscalc()withsomecomponentvalue?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/45456674/

javascript - 在 JavaScript 中安全使用 "with"

这个问题在这里已经有了答案:AretherelegitimateusesforJavaScript's"with"statement?(33个答案)关闭9年前。我能找到的几乎所有记录with的资源都警告不要使用它,主要是因为如果undefinedvariable,它可能会产生不可预测的影响。我想了解它以便有效地使用它-毕竟它的存在是有原因的。甚至eval也有其非邪恶用途!因此,考虑到这一点,假设我想从一个元素中删除所有子节点,而不使用elem.innerHTML="";以下是否安全?with(elem)while(firstChild)removeChild(firstChild);请

javascript - 如何使用 HTML Canvas 执行洪水填充?

有没有人在javascript中实现了洪水填充算法以与HTMLCanvas一起使用?我的要求很简单:从一个点开始用单一颜色填充,其中边界颜色是大于指定点颜色的某个增量的任何颜色。varr1,r2;//redvaluesvarg1,g2;//greenvaluesvarb1,b2;//bluevaluesvaractualColorDelta=Math.sqrt((r1-r2)*(r1-r2)+(g1-g2)*(g1-g2)+(b1-b2)*(b1-b2))functionfloodFill(canvas,x,y,fillColor,borderColorDelta){...}更新:我自

javascript - jQuery-UI 可调整大小 : scale all alsoResize elements in proportion with resizable div

我有一个可调整大小的div,它位于已设置为alsoResize的一系列元素之上。在视觉上,可调整大小的元素是alsoResize元素的边界框。我希望能够根据可调整大小的div的比例调整alsoResize元素的大小。UI的默认行为使每个元素在调整大小时都有固定的左侧和顶部位置:http://jsfiddle.net/digitaloutback/SrPhA/2/但我想调整每个AR元素的左侧和顶部,以便在调整大小时随边界框一起缩放。我最初认为通过更改alsoResize插件不会太麻烦。这是我添加到调整大小的内容:_alsoResize://Getthemultipliersvarscal

javascript - 如何将 Canvas 作为图像保存到 Firebase 存储?

我正在尝试将Canvas作为图像保存到Firebase存储中。我已经阅读了很多关于将Canvas保存到服务器的文章和问题,并尝试用下面的代码来实现。functionserver(){canvas=document.getElementById("c");varstorageRef=firebase.storage().ref();varmountainsRef=storageRef.child('mountains.jpg');varimage=newImage();image.src=canvas.toDataURL("image/png");varuploadTask=storag

javascript - Canvas - Canvas 保存为图像后,橡皮擦在 Canvas 上绘制黑线

在Canvas上绘图非常好。甚至橡皮擦也能正常工作。问题是,当Canvas保存为图像时,它绘制的是黑线而不是橡皮擦。为了更好地理解,我添加了屏幕截图和代码。1。在删除绘图时-一个。源代码-erase(){this.ctx.globalCompositeOperation='destination-out';}handleMove(ev){//letctx=this.canvasElement.getContext('2d');letcurrentX=ev.touches[0].pageX-this.offsetX;letcurrentY=ev.touches[0].pageY-this

javascript - 将 Canvas 图像和 Canvas alpha 蒙版合并到 dataurl 生成的 png

给定两个像素大小相同的Canvas,其中canvas1包含任意图像(jpg、png等),canvas2包含黑色和非黑色像素。我想要实现的目标:使用第三个canvas3我想克隆canvas1并让每个黑色canvas2像素(可能包括黑色阈值)在canvas3中都是透明的我已经有了这样一个可行的解决方案:canvas3context.drawImage(canvas1,0,0);varc3img=canvas3context.getImageData(0,0,canvas3.width,canvas3.height);varc2img=canvas2context.getImageData(

javascript - Jest : Mock ES6 Module with both default and named export

我有一个带有默认导出和命名导出的ES6模块:/**/src/dependency.js**/exportfunctionutilityFunction(){returnfalse;}exportdefaultfunctionmainFunction(){return'foo';}它被第二个ES6模块使用:/**/src/myModule.js**/importmainFunction,{utilityFunction}from'./dependency';//EDIT:Fixedsyntaxerrorincodesample//exportdefaultmyModule(){expor

javascript - 如何从 JPG 的 arrayBuffer 表示创建 Canvas imageData 数组

首先,我知道有实现此目的的标准方法(readAsDataURL和drawImage),但不幸的是,它们不适用于此特定用例。我正在使用文件读取器API作为数组缓冲区读取图像,如下所示:varreader=newfileReader();reader.onload=function(e){varbyteArray=newUint8ClampedArray(e.target.result);//dostufftothisarray}reader.readAsArrayBuffer(file);然后我用这个返回的数据创建一个clampedarray。我现在想做的是使用putImageData将