fabricjs相关内容
自从更新fabric.js库以来,我们一直无法将线绘制到组中,然后将其添加到画布上. 我用不同版本的fabirc.js创建了2个相同的小提琴. 正在使用:1.6.2 http://jsfiddle.net/b0Lbovs5/ 最新版本: http://jsfiddle.net/hukpuc30/ /**/ var gridLayer = null;var gridSize
..
如何使用fabricjs或任何其他JavaScript库对文档应用黑白过滤器以获得以下结果? 输入图片: 预期结果: 输入图片: 预期结果: 解决方案 以下是解决方案:http://jsfiddle.net/qasLmxvh/1/ var canvas = new fabric.Canvas('c');$('.select_image').change(func
..
我当前正在使用fabricJS(版本1.4.0 )画布,并且我在画布上手动添加了100个对象,但是对象仅在我单击画布上的任何位置时才会出现,是否有一种方法可以强制画布刷新自身?如果可以以某种方式提供帮助,这是我的一种情况. ....initComplete:函数(设置,json){让客户= JSON;if(clients.length!== 0){//clients是一个长度为100的数组为(
..
我正在使用Fabricjs编码网页.首先,我在画布上绘制了一些圆圈,然后允许用户选择一个或多个圆圈.我写了一个selection:created处理程序,该处理程序创建一个表单并打印该表单中每个选定对象的坐标.问题在于这些坐标与我创建圆时设置的坐标完全不同.但是,只有当用户选择两个或多个圆圈时,这种情况才会发生. 我基本上要做的是:调用返回ActiveObjects []数组的getActi
..
在此 jsFiddle 中,我有一个Fabric行和一个rect.我的目标是在直线移动或与矩形成组移动时获得线坐标. 如果仅选择并移动线,则坐标会正确显示(我从
..
在我的代码中,我创建了使用织物形状裁剪图像的方法.我已经使用stackoverflow答案来实现这一目标.使用此方法后,不知何故我无法使用默认的布料画布渲染方法来渲染画布. var img01URL ='https://www.google.com/images/srpr/logo4w.png';var img02URL ='http://fabricjs.com/lib/pug.jpg'
..
如果我想在现有折线上添加一条额外的线,是否应该先从画布上删除该现有折线,修改点矩阵,然后添加新的折线?还是可以更改现有的折线,例如更改文本对象的文本? 解决方案 您可以删除整条折线并添加一条新折线,否则需要计算尺寸(left,top和pathoffset)并将其设置为折线. 演示 var canvas = new fabric.Canvas('c');var points = [
..
在body标签中考虑以下代码:
现在,在脚本标签下, var canvas = new fabric.Canvas('c1');canvas.on('mouse:down',getMouse);函数getMouse(ev){v
..
fabric.js存在的问题似乎很简单,但是我一直在寻找一个没有运气的解决方案,所以我在这里. 我创建了一个简单的组来绘制箭头,该箭头由线对象和放置在其端点处的旋转三角形组成.效果很好,但是当我动态更新线条的笔触宽度和三角形的宽度/高度时,组的边界框不会更新以匹配新尺寸.这是结果的图像: 这是现场演示.只需拖动滑块以更改笔划宽度和三角形大小,您就会看到问题. let canva
..
要在清晰的Canvas中为画线设置动画不是很困难,但是我不明白在Fabric中是如何做到的.例如,我得到了这一行: var L = new fabric.Line([50,100,200,200],{左:170,最高:150,中风:“红色"}) ,我需要它的结尾之一开始继续到下一点(就像用铅笔画线一样).我知道这里有一个'animate'函数,但是使用 L.animate('left'
..
是否可以设置iText对象的宽度和高度?创建对象时,如果设置宽度和高度,则不会执行任何操作.我需要的是将边框在画布上固定为可编辑区域的固定大小,我已经扩展了iText类以允许进行单个字符编辑,但是我似乎无法解决如何将框的大小设置为固定大小,并允许在其中进行内容编辑.请记住,文本框无法移动或缩放,它是静态的. 解决方案 为时已晚,但其他人可能正在寻找答案.首先,如果要提供固定宽度&,则可以使
..
小提琴- jsfiddle 排序: 在坐标(x1 = 50,y1 = 50,x2 = 450,y2 = 50)处画线 检查坐标y1.y1 = 50 将y轴上的线移动50个像素. 检查坐标y1.左y1 = 50 ???这是为什么?以及如何获得真实的坐标? var canvas = new fabric.Canvas('c');var line = new fabric.Li
..
我正在尝试使用FabricJS创建气泡,以集成到WordPress插件中(希望)免费发布,以帮助人们注释图像,我在此处找到了原始气泡:
..
这是选择时的最后一个字符位置.看起来像Lobster1.3这样可以自动缩进的字体会使某些字符宽度计算错误 解决方案 在创建使用该字体的fabricObject之前,必须确保字体已正确加载到画布上,如果没有,fabricjs将创建一个必须宽度的字符缓存手动删除以获得好的. var jsondata = {“对象":[{"type":“文本框","originX":“左","origi
..
fabricJS版本2.2.3 测试 jsFiddle 我正在尝试使用LabeledRect子类,但是我的问题是,每当我尝试从JSON加载它时,它都不会呈现,并且在控制台中也没有出现错误.参见下面的小提琴. 如何正确渲染?我认为我的问题出在fromObject函数中,但是我不知道在哪里. /***用于错误报告的fabric.js模板**请更新jsfiddle的名称(请参阅F
..
如何获取组内三角形相对于画布的相对位置(顶部,左侧)作为波纹管图像? 我遵循了以下主题: 解决方案 工作示例,您可以在这里找到: http://jsfiddle.net/mmalex/2rsevdLa/ 嵌套对象=>等等...//为简单起见,请忽略画布的缩放和平移var mTotal = fabric.util.multiplyTransformMatrices(mGroup,
..
在某些情况下,在我的mouse:down事件侦听器中,我想停用用户刚刚使用mouse:down激活的对象.换句话说,在某些情况下,当用户尝试拖动对象时,我想执行一些代码并防止拖动. 简单地打电话 fabric.deactivateAll(); 将取消选择对象(对象控件消失),但拖动功能不会中断. 我试图: fabric.fire('mouse:up'); 模拟用户放开对
..
我需要能够显示一个内部带有文本的矩形,但是我需要它来处理自动换行.我在fabric.js github issue#187 中找到了关于我真正需要什么的讨论这.也可以在fabric.js 拉动请求725 中找到,其中与问题.另外,我在当前的母版中找到了
..
我在fabricJs中有一个Text.我上下左右.这会将aCoords正确设置为这些值.但是,oCoords不匹配.并且“文本"未显示在正确的位置. 我怀疑我需要以某种方式设置为oCoords.以便在画布上的右侧像素坐标处(顶部和左侧)显示文本. 解决方案 aCoords和oCoords是两个不同的东西,不应同步. 在您的评论中,您谈论的是缩放画布. 顶部和左侧是2个绝对
..
我正在使用fabric.js在canvas上工作.我已经在画布上创建了文本.现在,单击按钮时我想增加字体大小. canvas.set({fontSize,40}); 这行不通吗?任何其他方法.i已经创建了提琴,请检查 var canvas = window._canvas = new fabric.Canvas('c');var text = new fabric.Text('Samp
..