Zeichenfolge in der Mitte eines Kreises - Fabrics.js

Question

Ich möchte einen farbigen Kreis mit einer Zahl in der Mitte zeichnen. Ich konnte nichts in den Dokumenten finden, um dasselbe zu erreichen.

Jede Anleitung in diesem Zusammenhang wäre sehr hilfreich.

Dank

Answer 1

Ich fand die Antwort darauf. sein kann, dies erspart jemand kostbare Zeit:

var circle = new fabric.Circle({ 
    radius: 100, 
    fill: '#eef', 
    scaleY: 0.5, 
    originX: 'center', 
    originY: 'center' 
}); 

var text = new fabric.Text('hello world', { 
    fontSize: 30, 
    originX: 'center', 
    originY: 'center' 
}); 

var group = new fabric.Group([ circle, text ], { 
    left: 150, 
    top: 100, 
    angle: -10 
}); 

canvas.add(group); 

http://fabricjs.com/fabric-intro-part-3

Answer 2

Sie könnten versuchen, ein fabric.Circle Objekt und fabric.Text Objekt mit der gleichen links und oben zu schaffen, die sowohl Mitte positioniert ist.

var circle = new fabric.Circle({ 
    top: 0, //Arbitrarily placed at top left corner 
    left: 0, 
    radius: 100, 
    originX: 'center', 
    originY: 'center' 
}); 

var text = new fabric.Text("Your number here", { 
    top: 0, 
    left: 0, 
    originX: 'center', 
    originY: 'center', 
    fill: "#FFFFFF" // Circle background defaults to black, so make text visible 
}); 

// Assuming you have a fabric.Canvas stored in canvas already 
canvas.add(circle); 
canvas.add(text);