KonvaJS - 如何使用按钮触发器添加形状？

Question

我对如何使用按钮触发器添加形状有疑问。但不工作

这是我的代码：HTML

<button id="btnCreateRectangle" class="btn-primary-blue">Button Text</button>

这里是我的 js：

        function addRectangle(layer) {

            var scale = 1;

            var rectangle = new Konva.Rect({

                x: 12,

                y: 12,

                numPoints: 5,

                innerRadius: 30,

                outerRadius: 50,

                fill: "#89b717",

                opacity: 0.8,

                draggable: true,

                name: 'rect',

                width: 128,

                height: 50,

                scale: {

                    x: scale,

                    y: scale

                },

                shadowColor: "black",

                shadowBlur: 4,

                shadowOffset: {

                    x: 5,

                    y: 5

                },

                shadowOpacity: 0.6,

                // custom attribute

                startScale: scale

            });

            layer.add(rectangle);

        }

document

            .getElementById('btnCreateRectangle')

            .addEventListener('click', function () {

                addRectangle(layer)

            });

我在 javasrcipt 语言中非常新，任何建议或答案将不胜感激

Answer 1

在将矩形添加到图层后，从 KonvaJS 的文档中，您应该将该图层添加到stage&nbsp;https://konvajs.org/docs/overview.htmlstage.add(layer);