seriesDefaults.labels Object

Configures the series data labels.

Example

    $("#chart").kendoChart({
        seriesDefault: {
            // adjust the default label appearence for all series
            labels: {
                // set the margin on all sides to 1
                margin: 1,
                // format the labels as currency
                format: "C"
            }
        },
        //...
    });

seriesDefaults.labels.ariaTemplate String | Function

The template which renders the ARIA label for the series labels.

The fields which can be used in the template are:

• category - the category name. Available for area, bar, column, bubble, donut, line and pie series.
• dataItem - the original data item used to construct the point. Will be null if binding to array.
• percentage - the point value represented as a percentage value. Available only for 100% stacked charts.
• series - the data series
• value - the point value. Can be a number or object containing each bound field.

Example

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
  dataSource: {
    data: [
      { value: 1, date: new Date(2012, 1, 1)},
      { value: 2, date: new Date(2012, 1, 2)}
    ]
  },
  dateField: "date",
  seriesDefaults: {
    labels: {
      template: "#= value #%",
      ariaTemplate: "The value for #= e.series.name # on #= e.category # is #= e.value #",
      visible: true
    }
  },
  series: [
    {
      field: "value",
      name: "Series 1"
    }
  ]
});
</script>

seriesDefaults.labels.background String

The background color of the labels. Any valid CSS color string will work here, including hex and rgb.

seriesDefaults.labels.border Object

The border of the labels.

seriesDefaults.labels.border.color String(default: "black")

The color of the border.

seriesDefaults.labels.border.dashType String(default: "solid")

The dash type of the border.

"solid"

Specifies a solid line.

"dot"

Specifies a line consisting of dots.

"dash"

Specifies a line consisting of dashes.

"longDash"

Specifies a line consisting of a repeating pattern of long-dash.

"dashDot"

Specifies a line consisting of a repeating pattern of dash-dot.

"longDashDot"

Specifies a line consisting of a repeating pattern of long-dash-dot.

"longDashDotDot"

Specifies a line consisting of a repeating pattern of long-dash-dot-dot.

seriesDefaults.labels.border.width Number(default: 0)

The width of the border.

seriesDefaults.labels.color String

The text color of the labels. Any valid CSS color string will work here, including hex and rgb.

seriesDefaults.labels.font String(default: "12px Arial,Helvetica,sans-serif")

The font style of the labels. labels

Example

    $("#chart").kendoChart({
        seriesDefault: {
            // adjust the default label appearence for all series
            labels: {
                // set the font size to 14px
                font: "14px Arial,Helvetica,sans-serif"
            }
        },
        //...
    });

seriesDefaults.labels.format String

The format of the labels.

Example

    //sets format of the labels
    format: "C"

seriesDefaults.labels.margin Number|Object(default: 0)

The margin of the labels.

Example

    $("#chart).kendoChart({
         labels: {
             // sets the top, right, bottom and left margin to 3px.
             margin: 3
         },
         //...
    });


    $("#chart").kendoChart({
         labels: {
             // sets the top and left margin to 1px
             // margin right and bottom are with 0px (by default)
             margin: { top: 1, left: 1 }
         },
         //...
    });

seriesDefaults.labels.padding Number|Object(default: 0)

The padding of the labels.

Example

    // sets the top, right, bottom and left padding to 3px.
    padding: 3


    // sets the top and left padding to 1px
    // padding right and bottom are with 0px (by default)
    padding: { top: 1, left: 1 }

seriesDefaults.labels.template String | Function

The label template. Template variables:

• value - the point value
• category - the category name
• series - the data series
• dataItem - the original data item used to construct the point. Will be null if binding to array.

Example

    // chart initialization
    $("#chart").kendoChart({
         title: {
             text: "My Chart Title"
         },
         seriesDefault: {
             labels: {
                 // label template
                 template: "#= value  #%",
                 visible: true
             }
         },
         series: [
             {
                 name: "Series 1",
                 data: [200, 450, 300, 125]
             }
         ],
         categoryAxis: {
             categories: [2000, 2001, 2002, 2003]
         }
    });

seriesDefaults.labels.visible Boolean(default: false)

The visibility of the labels.

Example

    $("#chart").kendoChart({
        seriesDefault: {
            labels: {
                // hide all the series labels by default
                visible: true
            },
            //...
        }
    });