Wie füge ich Text zu einem Kreisobjekt in fabricJS hinzu?

Question

Ich suche hier fabricJS-circle, und nicht gefunden gibt es eine Möglichkeit, Text wie Nummer 1 oder 2 oder 3 hinzuzufügen ... In einem Kreis auf Leinwand?

Das ist mein Kreis Objekt auf Leinwand:

function makeStaion(left, top, stationID) { 
    var c = new fabric.Circle({ 
     left: left, 
     top: top, 
     radius: 2, 
     fill: '#5afffa', 
     stroke: '#666', 
     selectable: true, 
     centeredScaling:true, 
     padding:2, 
     hasRotatingPoint: false, 
     borderColor: 'black', 
     cornerColor: 'black' 

    }); 
    c.hasControls = true; 
    c.station = true; 

    c.stationID = stationID; 
    c.stationName = stations[stationID].name; 
    c.description = stations[stationID].desc; 
    c.image = stations[stationID].image; 

    return c; 
} 

Answer 1

Ich denke, was Sie suchen ist eine Stoffgruppe.

Tutorial hier: http://fabricjs.com/fabric-intro-part-3#groups

Docs hier: http://fabricjs.com/docs/fabric.Group.html

so etwas wie dies versuchen:

var c = new fabric.Circle({ 
     left: left, 
     top: top, 
     radius: 2, 
     fill: '#5afffa', 
     stroke: '#666', 
     selectable: true, 
     centeredScaling:true, 
     padding:2, 
     hasRotatingPoint: false, 
     borderColor: 'black', 
     cornerColor: 'black' 
    }); 

var t = new fabric.Text(stationID, { 
     fontFamily: 'Calibri', 
     fontSize: 1.2, 
     textAlign: 'center', 
     originX: 'center', 
     originY: 'center', 
     left: LayoutCoordX(STA), 
     top: LayoutCoordY(BL-BLOffset)-radius-.4 
    }); 

var g = new fabric.Group([c, t],{ 
     // any group attributes here 
    }); 


    g.hasControls = true; 
    g.station = true; 

    g.stationID = stationID; 
    g.stationName = stations[stationID].name; 
    g.description = stations[stationID].desc; 
    g.image = stations[stationID].image; 

    return g;