Question

我想在Konva中创建一个拖放游戏。与这里的https://konvajs.github.io/docs/sandbox/Animals_on_the_Beach_Game.html非常相似。

但是我想拥有一个用于创建游戏的界面，作者可以在其中绘制背景图像。然后，它会根据这些路径自动生成游戏。

我有这段代码可以剪切背景图像。

        return _.map(this.props.areas, (area) => {
        return (
            <Group
                draggable={true}
                clipFunc={(ctx) => {
                    canvasDrawFuncMap[area.shape](ctx, area.coords);
                }}
            >
                <Image image={image} />
            </Group>
        );
    });

这里是否有性能问题。考虑到它每次重绘整个图像。然后剪辑它。是否有更好的方法来实现这种裁剪。

现在，我还要手动创建clipFunction并在地图中定义它们。无论如何，我是否可以使用Konva根据Konva形状生成这些函数

Answer 1

如果您担心性能问题，请查看性能提示：https://konvajs.github.io/docs/performance/All_Performance_Tips.html

这里的缓存可能会很有帮助。

目前尚无记录的方法可以将Konva节点用作剪辑对象。

从HTML5画布剪切图像（Konva）

1 个答案: