Class: Label

Kinetic. Label


new Label(config)

Label constructor.  Labels are groups that contain a Text and Tag shape
Name Type Description
config Object
Name Type Attributes Description
x Number <optional>
y Number <optional>
width Number <optional>
height Number <optional>
visible Boolean <optional>
listening Boolean <optional>
whether or not the node is listening for events
id String <optional>
unique id
name String <optional>
non-unique name
opacity Number <optional>
determines node opacity. Can be any number between 0 and 1
scale Object <optional>
set scale
scaleX Number <optional>
set scale x
scaleY Number <optional>
set scale y
rotation Number <optional>
rotation in degrees
offset Object <optional>
offset from center point and rotation point
offsetX Number <optional>
set offset x
offsetY Number <optional>
set offset y
draggable Boolean <optional>
makes the node draggable. When stages are draggable, you can drag and drop the entire stage by dragging any portion of the stage
dragDistance Number <optional>
dragBoundFunc function <optional>
// create label
var label = new Kinetic.Label({<br>
  x: 100,<br>
  y: 100, <br>
  draggable: true<br>

// add a tag to the label<br>
label.add(new Kinetic.Tag({<br>
  fill: '#bbb',<br>
  stroke: '#333',<br>
  shadowColor: 'black',<br>
  shadowBlur: 10,<br>
  shadowOffset: [10, 10],<br>
  shadowOpacity: 0.2,<br>
  lineJoin: 'round',<br>
  pointerDirection: 'up',<br>
  pointerWidth: 20,<br>
  pointerHeight: 20,<br>
  cornerRadius: 5<br>

// add text to the label<br>
label.add(new Kinetic.Text({<br>
  text: 'Hello World!',<br>
  fontSize: 50,<br>
  lineHeight: 1.2,<br>
  padding: 10,<br>
  fill: 'green'<br>



get Tag shape for the label. You need to access the Tag shape in order to update the pointer properties and the corner radius


get Text shape for the label. You need to access the Text shape in order to update the text properties