content Object

Defines the shapes content settings.

Example - customizing the shape content

<div id="diagram"></div>
<script>
  var Shape = kendo.dataviz.diagram.Shape;
  $("#diagram").kendoDiagram();
  var diagram = $("#diagram").data("kendoDiagram");

  var shape = new Shape({
    id: 1,
    x: 40,
    y: 40,
    fill: "#c0f0fc",
    content: {
      align: "bottom center",
      text: "State 1",
      color: "#cc3388",
      fontFamily: "Segoe UI",
      fontWeight: "bold",
      fontSize: 18,
      fontStyle: "italic"
    }
  });
  diagram.addShape(shape);
</script>

content.align String

The alignment of the text inside the shape. You can do combinations between "top", "middle" and "bottom" for vertical align and "right", "center" and "left" for horizontal align. For example, "top right", "middle left", "bottom center", and so on.

content.color String

The color of the shape content text.

content.fontFamily String

The font family of the shape content text.

content.fontSize Number

The font size of the shape content text.

content.fontStyle String

The font style of the shape content text.

content.fontWeight String

The font weight of the shape content text.

content.text String

The text displayed in the shape.