问题标签 [fabricjs2]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
183 浏览

canvas - Fabricjs 动态模式不适用于 SVG

我正在使用动态模式来填充 SVG 图像。它可以很好地呈现模式,但我无法像FabricJs 教程中提到的那样在运行时转换模式。

以下是我的代码:

以下是我的 Js 代码。

每当我更改任何上述范围滑块时,它就会生效。让我知道我做错了什么。

0 投票
1 回答
439 浏览

html5-canvas - 如何在fabricjs中增加移​​动设备上的触摸区域控制点(不增加控制点的显示大小)?


如何使用 FabricJS 增加移动设备上控制点的触摸面积?因为在移动设备上它们太小而无法流畅交互。但不要改变控制点的大小(为了好看)。

这是我的代码:
如何增加控制点的交互性 = 查看控制点大小 x 2?

请告诉我解决这个问题的方法。

顺便说一句:(在移动设备上)有没有办法允许拖动对象之前只选择对象?

非常感谢!

0 投票
0 回答
33 浏览

fabricjs - Fabricjs忽略组内的透明对象

我想知道是否可以“忽略”透明对象。这个想法是,如果我在另一个对象上绘制,绘图路径将与底层对象组合(这可行)。现在我希望自由绘图路径仅在对象本身内部可见。请参阅下面的图片以供参考。

我有什么: https ://pasteboard.co/IqSuu4Y.png

我想要什么: https ://pasteboard.co/IqSwxfv.png

我在想“perPixelTargetFind”选项可以介入,但我无法让它工作。

0 投票
1 回答
301 浏览

html5-canvas - 如何在移动设备上的 fabricjs 上启用和处理“点击”事件?



我想在移动设备上使用fabricjs 处理事件点击。实现它的正确方法是什么?

目前,我看到在 fabricjs 源代码中实现“tap”事件。如果我想处理那个事件,我需要更改 fabricjs 源代码:

添加最后一行:

现在我可以通过“longpress”事件来捕捉点击事件。

我的问题是有另一种很好的方法来处理fabricjs上的'tap'事件而无需修改fabricjs源代码并且可以通过听“touch:tap”事件名称来处理'tap'事件?

谢谢,

0 投票
1 回答
206 浏览

javascript - 如何修复 FabricJS 缩放的多边形剪裁偏移

我正在尝试将 FabricJS 矩形形状剪辑为多边形形状。裁剪工作正常,直到现在需要裁剪的多边形形状被缩放。在此之后,多边形裁剪会导致一些奇怪的偏移。

谁能帮助我如何修复该功能以防止在缩放剪辑对象时出现多边形偏移问题。

这是缩放前的样子。剪辑工作正常

  1. 图片 => https://i.imgur.com/Eop2YJh.png

然后在缩放多边形时出现问题。

2:图片=> https://i.imgur.com/ICkP8SG.png

这是关于剪辑功能的代码

https://jsfiddle.net/0xpvc9uq/

因此,如果有人知道重点是什么以及如何解决它,我会很高兴。

谢谢

0 投票
0 回答
122 浏览

fabricjs - 带有Fabricjs的角度6更新折线点错误

我正在将 angular 6 和 fabricjs 2.6 用于对象与折线连接的连接器应用程序。更新折线点后,我无法选择连接线或在画布缩放时消失。我已经使用了 setCoords 方法,但无法选择折线。

0 投票
0 回答
366 浏览

javascript - Fabric画布元素上的多选问题

我有很多物体的画布。我必须将选定的对象分组到一个组例如:如果有 6 个对象,如果用户单击第一个对象,然后单击第二个对象,则第一个和第二个应分组为单个选择,如果他选择第三个,则三个对象应分组为一个选择。

我能够使用 ActiveSelection 来实现这一点。请在http://jsfiddle.net/rtaLf810/3/找到代码。

我现在面临的问题是,每当我尝试移动选定的组时,对象要么消失,要么移动到不同的坐标。

此外,我无法在组选择中选择对象。在下图中,无法选择绿色圆圈,因为它在选定的组内(文本+三角形)。

在此处输入图像描述

0 投票
0 回答
1037 浏览

javascript - 如何在fabric js上添加对象到组

我想动态地将矩形添加到组中。但是当我在顶部或左侧添加时,组的左上角会跳转到添加的矩形的左上角。请帮我解决。

我如何添加矩形:

0 投票
1 回答
325 浏览

javascript - react-fabricjs TypeError:无法读取未定义的属性'bool'

我正在尝试评估 react-fabricjs 包,但它似乎不适用于当前的 React 16.12.0 版本。我得到的错误是: TypeError: Cannot read property 'bool' of undefined in/./src/StaticCanvas.jsx?:414:40随后是一堆其他错误。关于如何使用 Fabricjs 或建议另一个库的任何想法?

为了复制这个问题,我只需创建空白的 React 应用程序npx create-react-app demo并添加包yarn add react-fabricjs --save

0 投票
1 回答
2375 浏览

javascript - 如何使用 Fabric js 以编程方式自由绘制?

使用 Fabric js 构建多人涂鸦。

尝试使用fabric js实现多人涂鸦,想法是当U1在画布上绘制时,我们将点推送到RTDB并在客户端上获取这些点并以编程方式在两个客户端中绘制笔画。