Come selezionare l'oggetto Fabric.js a livello di codice

Desidero selezionare a livello di codice l'oggetto Fabrics.js. Cosa devo fare? Per esempio, io sono l'aggiunta di due oggetti come questo:Come selezionare l'oggetto Fabric.js a livello di codice

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 
    }));

e ho due tasto mentre si fa clic sul pulsante denominato

selezionare rettangolo
selezionare secondo oggetto

Mentre cliccando il pulsante Seleziona rettangolo dovrebbe selezionare la forma rettangolare e facendo clic sul pulsante Seleziona secondo oggetto dovrebbe selezionare il secondo cerchio dell'oggetto.

Ecco lo Jsfiddle per soluzione alternativa.

Mi sono goggato e stufo, eccomi cercando un punto su come iniziare.

EDIT

Mi piace avere l'ID per ciascun oggetto, dovrebbe essere possibile per selezionare l'oggetto utilizzando tale ID, il motivo per cui chiedo questo è, durante l'utilizzo delle cose di collaborazione non possiamo dire sicuramente tutti i nodi connessi avranno l'oggetto nello stesso indice, quindi l'ID univoco sarà utile.

fonte

2013-11-20 Thirumalai murugan

@kangax si prega di aiutare in questo –

Sì, è possibile impostare id per ogni elemento aggiungendo il codice qui sotto in all.js

Negli fabric.js costruire versione 1.3.0: In la dichiarazione oggetto aggiungere

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

Ora è possibile impostare l'ID oggetto con:

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

È possibile recuperare l'ID oggetto con:

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

fonte

2013-11-22 03:25:06 John

grazie ora sono in grado di aggiungere l'ID +1, puoi dirmi che è possibile selezionare l'oggetto che usa quell'id? se sì per favore dammi l'esempio per quello –

In ogni caso devi attraversare tutti gli oggetti e controllare se l'oggetto corrente id == l'id dell'oggetto che ti serve! Semplice..se sì fai qualche azione .. – John

ya Prima ci penso, ma penso che non sia un buon modo se stiamo avendo l'enorme numero di oggetti è? –

che si desidera utilizzare:

canvas.setActiveObject(canvas.item(0));

Nei pulsanti evento Click

Il numero corrisponde all'ordine in cui l'oggetto è stato aggiunto alla tela.

vedere qui:

http://jsfiddle.net/ThzXM/1/

fonte

2013-11-20 17:18:48

Bello! non possiamo ottenere il numero dell'articolo onclick e poi passarlo a 'canvas.setActiveObject (canvas.item (itemNumber))?' – softvar

C'è un modo per ottenere il numero dell'articolo selezionato (onclick)? – softvar

@danbrown c'è un modo per impostare l'id per l'elemento perché mi piace farlo in modo collaborativo .... quindi se si seleziona per posizione dell'articolo sarebbe diverso in ogni persona quindi se possiamo aggiungere qualche ID univoco e recuperarlo sarebbe un po 'buono. +1 per il tuo prezioso suggerimento –

Per trovare il numero di oggetti in tessuto (numero articolo) dell'uso dell'oggetto selezionato:

canvas.on({ 
    'object:selected': selectedObject 
}); 

function selectedObject(e) { 
    var id = canvas.getObjects().indexOf(e.target); 
}

var id è lo stesso numero se si imposta l'oggetto in modo programmatico come nella risposta di Dan Brown:

canvas.setActiveObject(canvas.item(id)); //id = 0, 1, 2 etc.

fonte

2015-04-23 15:19:06 Dradge

Come selezionare l'oggetto Fabric.js a livello di codice

risposta

Problemi correlati