如何以编程方式选择Fabric.js对象 [英] How to select Fabric.js object programmatically

问题描述

我想以编程方式选择Fabrics.js对象。我需要做什么？例如，我正在添加两个这样的对象：

I want to programmatically select Fabrics.js object. What do I have to do? For example, I am adding two objects like this:

var canvas = new fabric.Canvas('canvas');
canvas.add(new fabric.Rect({
    left: 100,
    top: 100,
    width: 75,
    height: 50,
    fill: 'green',
    stroke: 'black',
    strokeWidth: 3,
    padding: 10
  }));

 canvas.add(new fabric.Circle({
    left: 200,
    top: 200,
    radius: 30,
    fill: 'gray',
    stroke: 'black',
    strokeWidth: 3
  }));

我点击了名为

1. 选择矩形


2. 选择第二个对象

单击选择矩形按钮时，应选择矩形形状，单击选择第二个对象按钮时，应选择第二个对象圆。

While clicking the select rectangle button it should select the rectangle shape and while clicking the select second object button it should select the second object circle.

这是Jsfiddle 用于解决方法。

我瞪眼并厌倦了，在这里我寻求一些点如何开始。

I goggled and fed up, here I am seeking for some point how to start.

编辑

我想拥有每个对象的ID ，应该可以选择使用该ID的对象，为什么我要问这是，在使用协作的东西时我们无法确定所有连接的节点都将具有相同索引中的项目，因此唯一ID将是有用的。

I like to have the ID for each object, it should be possible to select the object using that ID, why I am asking this is, while using the collaborative things we can't tell surely all the connected nodes will have the item in same index, so unique id will be useful.

推荐答案

是的，您可以通过在下面的代码中添加以下代码来为每个项目设置ID ll.js

Yes, you can set id for each item by adding the below code in all.js

在fabric.js构建版本1.3.0中：在对象声明中添加

In the fabric.js build version 1.3.0 : In the Object declaration add

 var object = {
   id:   this.id,
   remaining properties in all.js
  }

现在您可以设置对象ID：

Now you can set the object id with:

canvas.getActiveObject().id=your id value;

您可以使用以下方式检索对象ID：

You can retrieve the object id with :

Myid= canvas.getActiveObject().get('id');

这篇关于如何以编程方式选择Fabric.js对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！