如何在 KineticJS 中复制和粘贴形状答案

【问题标题】：How to copy and paste shapes in KineticJS如何在 KineticJS 中复制和粘贴形状
【发布时间】：2013-03-21 11:49:38
【问题描述】：

我有一个这样的按钮1。

var Button1 = new Kinetic.Polygon({
            points: [0, 0, 0, 30, 15, 15],
            fill: 'rgb(0, 255, 0)'
        });

现在我想复制它（复制它）。我该怎么做？

我试过了-

    var Button2 = new Kinetic.Polygon();
    Button2 = Button1;

这不起作用，因为画布上只绘制了一个副本。

我应该怎么做？

【问题讨论】：

标签： javascript canvas kineticjs

【解决方案1】：

在 KineticJS 中复制对象最简单的方法是使用 clone 方法：

 var Button1 = new Kinetic.Polygon({
        points: [0, 0, 0, 30, 15, 15],
        fill: 'rgb(0, 255, 0)'
 });

 var Button2 = Button1.clone();

Button2 现在是 Button1 的精确副本

【讨论】：

另外，别忘了做 layer.add(Button2);和 layer.draw();以便对象出现在舞台上。
这是官方的复制粘贴方式，所以我接受。感谢您的回答。
你也可以在 clone 方法中传入参数来覆盖原始对象中的参数，例如 Button1.clone({fill: 'rgb(0, 123, 0)'});这意味着它将具有相同的点但不同的填充。
感谢 Eric，您图书馆的忠实粉丝。

【解决方案2】：

这个呢：

var buttonData = {
            points: [0, 0, 0, 30, 15, 15],
            fill: 'rgb(0, 255, 0)'
        }

var Button1 = new Kinect.Polygon(buttonData);
var Button2 = new Kinect.Polygon(buttonData);

【讨论】：

感谢您的建议。我从来没想过那个。但是这种方法更好还是 $.extend() 更好（就性能而言，哪个更常见）

【解决方案3】：

Button1 和 Button2 现在指向同一个 Kinetic 对象。

你可以尝试使用jQuery的扩展方法

var Button2 = $.extend({}, Button1);

这将复制对象。

【讨论】：

.clone() 方法更好，并且内置在 KineticJS 中。