带有 Konva.js 的上下文菜单

Question

我有一张包含多个对象的地图，例如玩家、塔楼、敌人等。

它们通过这个函数被添加到地图中：

const createCustomObject = (sides, radius, color, x, y) => {
  let customObject = new Konva.RegularPolygon({
    fill: color,
    x: x,
    y: y,
    sides: sides,
    radius: radius,
    id: returnID()
  });
  customObject.on("click", e => console.log(e.target.id()));
  addLayer(objectLayer, customObject);
};

现在我需要更改它，以便当用户点击任何customObject 时，上下文菜单应该会出现带有可点击选项的“删除”、“显示 ID”等。

我该怎么做呢？我正在考虑创建一个Konva.Rect() onclick 并填充可点击的Konva.Text() 对象，但也许我错过了其他方式？我的好像很丑。

Answer 1

这就是我所做的。我做了一个矩形，并将 Konva.Text 放在它上面。然后为所有 Konva.Text 元素制作 onclick 函数