Question

也许是新手问题。

HTML：

<div id="myDiv">
    <canvas id="myCanvas" style="display:inline; border: 1px solid #000000;"> </canvas>
 </div>

我想做的是将KonvaJS平台放置在上方myCanvas上方（即，z轴上方）。

如果我使用默认代码：

var stage = new Konva.Stage({
      container: 'myDiv',
       width: window.innerWidth,
       height: window.innerHeight
});

舞台位于myCanvas之后的行内。

是否可以告诉Konva对其画布进行分层？

Answer 1

您可以将舞台容器添加到myDiv中：

<div id="myDiv">
  <canvas id="myCanvas" style="display:inline; border: 1px solid #000000;"></canvas>
  <div id="container"></div>
</div>

然后创建一个舞台，将其放置在绝对位置的顶部。

const myCanvas = document.getElementById('myCanvas');

const stage = new Konva.Stage({
  container: 'container',
  width: myCanvas.width,
  height: myCanvas.height
});

stage.container().style.position = 'absolute';
stage.container().style.top = '0';
stage.container().style.left = '0';
// add z-index if you need it

可以在另一个画布上叠加KonvaJS舞台/画布吗？

1 个答案: