草庐IT

canvas2image

全部标签

javascript - 使用 JavaScript 调整图像大小以在 Canvas 中使用 createPattern

我见过一些关于如何调整图像大小的技巧在IMG标签中使用,但我想在里面有一个图像变量一个Javascript,调整它的大小,然后使用里面的图像context.createPattern(图像,“重复”)。我还没有找到任何提示关于如何做到这一点。您可以在http://karllarsson.batcave.net/moon.html找到功能演示用图片说明我想做什么。Loktar的解决方案看起来不错。我还没来得及修复正确的方面,但现在我知道该怎么做了。再一次谢谢你。这是一个工作演示http://karllarsson.batcave.net/moon2.html这是我没有按照我的意愿工作的两

javascript - 如何获取组中对象的 Canvas 相对位置?

通常一个对象相对于Canvas的位置可以从它的.left和.top属性得到,但是如果对象在一个选择/组。有没有办法获得它们相对于Canvas的位置? 最佳答案 当对象在组内时,其相对于Canvas的坐标将取决于组的原点(以及对象的原点)。假设我们有这段代码,其中添加了一个矩形和一个圆圈。varcanvas=newfabric.Canvas(document.getElementById('c'));varrect=newfabric.Rect({width:100,height:100,left:50,top:50,fill:'rg

javascript - 使用 fabric js 获取 Canvas 对象

我正在使用Fabric.js并在一个地方创建了一个织物Canvas对象。varx=newfabric.Canvas("mycanvas");现在在另一个地方,我想访问这个“x”不可用的对象。那么我怎样才能得到相同的织物Canvas对象。我不想更改x的范围或将x作为参数传递。另外,如何从fabriccanvas对象获取toDataURL? 最佳答案 假设mycanvas是Canvas元素的ID,您可以将对fabric对象的引用存储在Canvas元素本身上:varx=newfabric.Canvas("mycanvas");docume

javascript - 使用 ruby​​ on rails 和 javascript 将 Canvas 转换为图像并在新窗口中打开

我很困在这个问题上,希望你们能帮助我。我想要实现的是点击一个链接、按钮或图像,这看起来更简单,我使用toDataURL将Canvas转换为图像。之后会打开一个包含此图像的新窗口。如何使用ruby​​onrails将从toDataURL生成的数据url传递到新窗口?提前致谢。 最佳答案 首先,这与Rails没有太大关系。不过,您可以使用Ruby来解决这个问题。首先像您已经在做的那样获取Canvas的内容:vardataURL=canvas.toDataURL("image/png");此时您可以简单地使用Javascript打开一个新

javascript - 如何将 <image> 元素添加到 SVG DOM

我有一个带有jpg图像的网页,用户在使用Raphael的基础上绘制了SVG涂鸦。我想允许用户在完成后保存合并的光栅化版本(我将自己用SVG版本做其他事情)当用户单击保存时,我想将该背景图像作为元素添加到生成的SVGDOM中,然后使用canvg将SVG写入Canvas元素。最后,我使用toDataUrl()方法将其转换为jpg。我无法让中间位工作—将图像添加到DOM的最佳方式是什么?当我使用下面的代码时,我收到一个javascript错误,提示appendChild()不是一个函数。我想知道这是否与我使用.html()方法获取SVG的方式有关——也许返回的内容没有被解释为真正的SVG文档

javascript - 如何在 javascript 中获取 HTML5 Canvas.todataurl 文件大小?

vardata_url=canvas.toDataURL("image/png");varimg=$("#img").attr("src",data_url);img文件的大小是多少? 最佳答案 如果你想知道data-url的字节大小,你可以这样做:varimgFileSize=data_url.length;但这不是png大小的实际大小。您可以通过这种方式非常准确地近似于真实的PNG大小:varhead='data:image/png;base64,';varimgFileSize=Math.round((data_url.len

Javascript/jQuery : remove shape/path from canvas

我似乎找不到在创建Canvas后从Canvas中删除形状或路径的功能。所以我在两点之间创建了一条贝塞尔曲线beginPath();bezierCurveTo();stroke();closePath();创建后如何从Canvas中删除它?我需要能够通过toggle()和blur()调用remove函数。我确定存在一些东西...在此先感谢您的帮助! 最佳答案 试试这个:ctx.save();ctx.globalCompositeOperation="destination-out";//drawinghereyoupathsecond

Medical Diffusion - Denoising Diffusion Probabilistic Models for 3D Medical Image Generation

MedicalDiffusion-DenoisingDiffusionProbabilisticModelsfor3DMedicalImageGeneration论文链接:https://arxiv.org/abs/2211.03364摘要计算机视觉的最新进展已经在图像生成方面显示出有希望的结果。扩散概率模型尤其从文本输入中生成了真实的图像,如DALL-E2、Imagen和StableDiffusion所示。然而,它们在医学中的应用尚未得到系统评估,因为医学中的图像数据通常包括三维体积。合成图像可能在保护隐私的人工智能中起着至关重要的作用,也可以用于增强小数据集。这里我们展示了扩散概率模型可以

javascript - Canvas 元素双重显示

绘制的线条不仅出现在Canvas-Element中,还出现在页面顶部,再次显示。这发生在触摸事件被释放时。在这里您可以找到源代码和结果(使用了PhoneGap和JqueryMobile)。有人知道这个错误的原因是什么吗?http://gomami.ch/bugs/screenshot.pnghttp://gomami.ch/bugs/screenshot.pngJavaScript(在包含到jQuery/PhoneGap后加载到header中)://*********************************************************//WaitforCor

javascript - 使用 cors 从 aws s3 加载的 Canvas 元素和图像在第一次加载时不起作用

所以我在我的AWSS3存储桶上设置了cors:*GET在我的html中在我的javascript中,我正在加载图像并将其放入Canvas图像中。varoutlineImage=newImage();outlineImage.crossOrigin='';outlineImage.src=drawing_image;outlineImage.onload=function(){varcanvasDiv=document.getElementById('explain_canvas');varcanvas=document.createElement('canvas');canvas.se