问题标签 [react-konva]

我正在开发一个应用程序，该应用程序从患者那里获取有关头痛、感冒咳嗽等参数的输入。对于医生仪表板需要用动画（同心圆）突出显示身体部位，其半径根据用户的输入而变化。请帮我指路。用什么框架，怎么想这个问题。

提前致谢。

fillPatternImage 中的以下代码（来自 imgur 上的图像）有效：

然后我找到我想要改变的形状的参考，我使用setAttr("fillPatternImage", image)它，它的图案显示在我的形状中

但是当我这样做时：

然后做整个setAttr事情，这是行不通的。我确信来源是有效的，因为如果我使用上传图像中的 url 创建一个名为 imageUrl 的新状态并执行：<img src={this.state.imageUrl}，则图像会完美显示。

2个src之间的唯一区别：

• 来自直接imgur来源的来源只是图像的链接，例如：http: //i.imgur.com/A6H6xHF.png

• 上传图片的来源是“blob：http://localhost:3000/c0e5194d-1c58-4aa1-b4d6-6abf7438e179 ”

顺便说一句，从公共文件夹导入图像文件，然后将其设置为本机 javascript 图像的 src，然后使用该图像的 fillPatternImage 也可以。

我正在尝试检索剪辑区域的 dataURL，但只要矩形在该区域之外，生成的图像就会有边距（我猜它正在尝试包含矩形）。

以下是行为示例：https ://codesandbox.io/embed/clip-area-x24ci

（单击“导出”按钮或将黑色矩形移到剪切区域之外）

是否可以仅检索剪辑区域的内容？

我只需要用另一个替换一个数组对象的键。我将提供一个理由说明为什么我认为我需要在之后这样做以尝试避免 TLDR，以防有人发现我可能根本不需要这样做的更深层次的原因。

所以给出：

我想在数组中指定两个对象并遍历它们的属性（因为属性列表可能很长），然后说（伪代码）：

尽可能少的代码。

理由：

我正在使用带有画布库的反应，其中状态数组中的两个可拖动画布对象需要切换 z 顺序而不触发反应的重新渲染（否则画布会丢失对象被拖动位置的记忆......）。

所以当我试图简单地做：

或者：

那些 canvasImages 失去任何拖动位置：

我正在对 Konva.Image 应用过滤器，但找不到任何方法来删除这些过滤器并返回到原始图像。

我怎样才能做到这一点？

我正在使用 React-Konva 库来使用我的调色板创建形状。然后我拖动它进行连接。但是一旦它被连接，它应该是可拖动的组应该只适用于每个项目。

我在 const 全局变量中放入了不同的形状。

现在，一旦我检查了调色板按钮，我将变量推入数组中，但是一旦形状变量的连接器接触反应角度，那么它应该作为单个元素加入或分组

1. 首先，连接器意味着形状不应跨越矩形或不能进入矩形边界内。
2. 连接后，单个形状或矩形不应移动，而是像一组一样集体移动

我使用 react-konva 将矩形作为画布上的屏幕。如何在使用 DOM 元素选择目标元素的测试工具（如 cypress）上测试单击屏幕矩形？

我看到这是不可能的，除非通过创建屏幕 DOM 元素来进行测试，而不是画布上当前存在的内容。不知何故，这将花费大量时间并且也很麻烦。

所以我想知道我们是否有办法解决这个问题来测试在画布本身中绘制的对象？

我有一个我想用 Konva（和 react-konva 绑定）绘制的网络。当位置更新时，我想将网络中的节点动画到它们的新位置，同时动画连接它们的链接的开始和结束位置。

我从以下简单示例开始，但似乎无法以与节点相同的方式让 Line 进行动画处理。

有没有办法解决这个问题，还是我以错误的方式接近它？

我正在使用 Konva（准确地说是 react-konva）构建一个带有图像处理的 Cordova 应用程序。这个想法是，当我用相机拍照时 - 我可以使用这个库向它添加一些标记。但由于我没有太多空间——我需要一个相对较小的舞台（例如 300x500）来编辑大图像（例如 2000x3000）。操作完成后 - 我必须将该阶段保存到文件中。

目前，当我将舞台保存到文件中时 - 图像会缩小以适合比例，而那个小图像是保存的结果，这会使图像无法使用。

如何在不损失图像质量的情况下缩小图像以适应舞台画布？

我想使用给定百分比的 KonvaJS 的 Sepia 过滤器。就像https://www.cssfilters.co/上的 20% 棕褐色

是否可以像这样在 KonvaJS 上设置 Sepia 的值？