草庐IT

the-canvas-element

全部标签

javascript - 在 native JavaScript 中获取 Canvas 内鼠标位置的最现代方法

这个问题在这里已经有了答案:HowdoIgetthecoordinatesofamouseclickonacanvaselement?[duplicate](22个答案)关闭3年前。首先,我知道这个问题已经被问过很多次了。但是,提供的答案并不一致,使用了多种方法来获取鼠标位置。几个例子:方法一:canvas.onmousemove=function(event){//thisobjectreferstocanvasobjectMouse={x:event.pageX-this.offsetLeft,y:event.pageY-this.offsetTop}}方法二:functionge

javascript - 从 Canvas 保存图像时缺少扩展名

我使用此代码在Javascript中保存图像:window.location.href=grid.toDataURL("image/png").replace("image/png","image/octet-stream");代码有效,但保存的文件没有任何扩展名,我必须手动重命名。我的问题是如何将扩展名放在末尾?谢谢。 最佳答案 toDataURL生成数据uri而不是文件名,因此扩展名不适用于这种情况。data-uri只是二进制内容的文本编码版本,某些浏览器可以将其作为文件读取——如果您愿意,也可以是数据流。由于数据流没有任何文件

javascript - 语法错误 : invalid arrow-function arguments (parentheses around the arrow-function may help)

这样的代码会产生一个错误:if(hr>t1[0]||(hr==t1[0]&&min=>t1[1])&&hr错误:SyntaxError:无效的arrow-function参数(arrow-function周围的括号可能有帮助)这是什么意思,它是如何发生的?Google搜索此错误毫无用处。编辑:似乎是使用=>=而不是=引起的。但我仍然很好奇为什么错误是这样表述的,以及箭头函数应该是什么。编辑2.首先,我没有意识到这实际上可能是特定于浏览器的问题。另外,我没有意识到现在人们在浏览器上下文之外的其他地方使用JS。所以,为了说明这一点,我的浏览器是MozillaFirefox25.0.1。

javascript - Angular : How can I transclude an element into a template that uses ng-repeat?

我有一个carousel指令,其中包括一些分块,用于将传入的items数组映射到元素结构数组的数组中,然后生成类似于以下伪代码的标记:这个Angular模板看起来像这样:[elementshouldbetranscludedintothisspot.]鉴于我的View代码:tagshouldappearinsidethe'carousel.html'template'sng-repeatlist.-->{{item.name}}我希望嵌入的元素绑定(bind)到最深的ng-repeat的item对象完整的Plunker和简化的测试用例可在此处获得:http://plnkr.co/edi

javascript - fengyuanchen Cropper - 如果旋转,如何使图像适合 Canvas ?

我浏览了fengyuanchen的cropper文档。如果旋转,我希望图像默认适合Canvas。但我找不到实现这一目标的方法。知道如何实现此功能吗?我希望它成为默认值:link在此处查看问题演示:link 最佳答案 我修复了此行为,但出于我的特殊需要。我只需要一个旋转按钮,它可以将图像旋转90°。出于其他目的,您可以扩展/更改我的修复。它通过动态更改cropbox尺寸以“严格”模式工作。这是我想要旋转图像时调用的函数。啊,另外,错位错误也已修复。var$image;functioninitCropper(){$image=$('.i

javascript - 如何在 fabric.js 中用 Canvas 保存图像

我正在创建一个T恤定制应用程序,其中我使用CSS将Canvas放在图像上,但问题是将该图像保存为Canvas。toDataURL只给出了Canvas区域的一部分,但我想要整个图像。StackOverflow上有其他解决方案,但它们没有解决这个问题。 最佳答案 你好,您必须创建一个包含消息的文本对象的图像对象(T恤)。为此,使用fabric.Image.fromURL()函数加载图像,并在函数内部创建一个文本对象,用于显示T恤消息。因此,您的图像和文本属于一个组对象。每次您要加载新文本时,您都调用loadText函数并更改文本对象。我

javascript - 无法监视 angular.element

我有一个Jasmine测试由于spyOn未执行而不断失败。下面的测试会自动失败:it('simpletest',function(){spyOn(angular,'element');});错误是:TypeError:'undefined'isnotanobject(evaluating'angular.element(handle.elem).off')at/Users/geoff/Project/www/components/angular-mocks/angular-mocks.js:1946at/Users/geoff/Project/www/components/angula

javascript - Node + xmldom : How do I change the value of a single XML field in javascript?

使用nodev.0.10.29,Expressv4.12.0和xmldomv0.1.19,我正在尝试执行以下操作:步骤将XML文件读入字符串使用xmldom将字符串转换为XML对象设置default字段到test将XML对象转换回字符串问题问题是在我设置之后字段,它在对象中正确设置,但是当我将它转换为字符串时,字段恢复为旧值(错误)。代码代码如下所示:varfs=require('fs');varDOMParser=require('xmldom').DOMParser;varXMLSerializer=require('xmldom').XMLSerializer;varfilena

javascript - 将 Canvas 图像作为 multipart/form-data 类型的 Blob 上传到 facebook

我正在尝试使用facebookapi从我保存在页面上的Canvas上传图像:varfile=dataURItoBlob(canvas.toDataURL('image/jpeg',1.0))FB.api('/me/photos','POST',{source:file,message:'photodescription'},function(response){console.log(response)})这是blob转换器:functiondataURItoBlob(dataURI){varbyteString=atob(dataURI.split(',')[1]);varab=ne

javascript - Algolia 即时搜索.js : how to display the results with a random order?

我正在使用Algoliainstantsearch.js来显示选举候选人(此处:https://laprimaire.org/candidats/)。我希望候选人的初始显示是随机的,以便每个候选人或多或少获得相同的可见度。我在这个答案中读到,它不是Algolia的一个特性,但它应该可以通过一些js技巧来实现:Isitpossibletosortrandomly,andtoqueryonfieldifitexists?问题是我正在使用instantsearch.js,但我找不到如何在instantsearch.js的情况下实现上述searchFunction。我从文档中看到可以使用sea