问题标签 [react-konva]

我正在尝试创建 2 个不能重叠的图层（图像），因此它们仍然可以自由拖动，但不会相互显示。

我尝试过使用 zIndex 或空白 Rect，但无法弄清楚如何制作 2 个不能重叠的可拖动图层（非常类似于溢出：隐藏行为）

附上一个 GIF 来显示问题，每一层都不应该在分隔线后面可见。

)

I have a react konva project where you can load an image into a canvas and then move around dragging the canvas. If you load a different image, then it appears on the position where the previous image was dragged to. I am guessing if there is any way to reset this "dragged" position on the stage (the draggable component). The only thing I can think of,because I'm using react, is to re-render the entire component, which is not a problem right now, but I want to have alternatives.

The reason why I made the stage draggable instead of the image itself it's because I have a series of points that I want to be moved along with the image. Sure I can add both points and image to a group, but that will introduce some complexity that it's probably not worth it.

The code that I have now looks something like this:

我找到了一个使用 React-Konva 和 Free Drawing 的好例子，但我可以使用 React-Hooks。该示例非常好且简单。可以在这里找到：

React-Konva 示例

我试图用 React Hooks 重现它，但我没有用，也许我错过了一些东西。实际上，我真的不明白它是如何工作的。

我做错了什么？我只是不确定！

我想绘制笛卡尔坐标系中的数据。原点 (0/0) 从左下角开始。在 HTML-canvas 中，原点位于左上角。如何切换 y 轴（在 react-konva 或 konva 中）？

作为示例，提供的代码从左上角向中心绘制一条线。我想通过切换y轴从左下角开始。

一切顺利，斯特凡

我有一个包含组引用的变量，当我调用getClientRect()时，它返回“IReact”类型。

由于 IReact 不在默认类型索引中，我应该从内部类型文件中导入类型还是有更好的方法？

简化代码参考：

我正在尝试使用 react-konva 制作一个应用程序，其中图像覆盖整个舞台，并且舞台是可拖动和可缩放的。所以我正在寻找一种将拖动绑定到图像边缘的方法。

我查看了这个演示并在我的代码中添加了一个dragBoundFunc，但是使用此代码我只能在顶部和左侧边缘拖动绑定我的舞台。

演示：https ://codesandbox.io/s/tender-chatterjee-ih31j

我正在渲染一个包含很多元素的画布。由于元素数量多且元素形状复杂，元素不会立即显示，而是延迟显示（有时超过 10 秒）。在此期间，整个应用程序冻结并且不显示加载指示。是否有可能在画布尚未完全渲染时以某种方式显示加载指示？

在我当前的项目中，我想用 react 和 react-konva构建类似图像编辑器的东西。

首先，我用一些道具和默认的可拖动星星渲染了一个 konva 舞台。

在下一步中，我们可以使用Imagereact-konva 为我们的舞台设置背景图像。

下一步，也是最后一步。

我们可以将 konva 阶段保存为 json 格式吗？

我正在使用 react-konva 在舞台上绘制形状并对其进行编辑，我选择了该形状，并且该形状已设置为专注于舞台（即来到舞台的中心）。单击一个按钮，我正在更新舞台的 X、Y 和比例，但我没有在舞台的中心获得准确的形状。

请查看此演示并分享您的意见：

https://codesandbox.io/s/shapecenterdemo-o9hg2?file=/src/ShapeCenterDemo.jsx

PS：无法从舞台上移除dragBoundFunc。

我有一个带有 SVG 的文件夹。我需要在 Konva 的舞台上动态添加这些 SVG。我尝试使用这个组件。但它不起作用。

它仅在我进行常见导入时才有效：

所以我该怎么做？=)