New to Kendo UI for jQuery? Start a free 30-day trial

YAxis.plotBands

configuration

The plot bands of the y axis.

yAxis.plotBands

Array

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [
    { type: "scatter", data: [[1, 2]]}
  ],
  yAxis: {
    plotBands: [
      { from: 1, to: 2, color: "red" }
    ]
  }
});
</script>

yAxis.plotBands.color

String

The color of the plot band.

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [
    { type: "scatter", data: [[1, 2]]}
  ],
  yAxis: {
    plotBands: [
      { from: 1, to: 2, color: "red" }
    ]
  }
});
</script>

yAxis.plotBands.from

Number

The start position of the plot band in axis units.

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [
    { type: "scatter", data: [[1, 2]]}
  ],
  yAxis: {
    plotBands: [
      { from: 1, to: 2, color: "red" }
    ]
  }
});
</script>

yAxis.plotBands.label

Object

The label configuration of the plotband.

The yAxis.plotBands.label.text option must be set in order to display the plotband label.

<div id="chart"></div>
<script>
$("#chart").kendoChart({
    series: [{
        data: [1, 2, 3, 4, 5]
    }],
    yAxis: {
        plotBands: [{
            from: 2,
            to: 4,
            color: "lightblue",
            label: {
                text: "Target Range",
                color: "red",
                font: "bold 12px Arial"
            }
        }]
    }
});
</script>

yAxis.plotBands.opacity

Number

The opacity of the plot band.

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [
    { type: "scatter", data: [[1, 2]]}
  ],
  yAxis: {
    plotBands: [
      { from: 1, to: 2, color: "red", opacity: 0.5 }
    ]
  }
});
</script>

yAxis.plotBands.to

Number

The end position of the plot band in axis units.

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [
    { type: "scatter", data: [[1, 2]]}
  ],
  yAxis: {
    plotBands: [
      { from: 1, to: 2, color: "red" }
    ]
  }
});
</script>

YAxis.plotBands

yAxis.plotBands

yAxis.plotBands.color

yAxis.plotBands.from

yAxis.plotBands.label

yAxis.plotBands.opacity

yAxis.plotBands.to

Related Members