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

Series.highlight.border

configuration

The border of the highlighted chart series. The color is computed automatically from the base point color.

The border option is supported when series.type is set to "donut", "bubble", "pie", "candlestick" or "ohlc".

series.highlight.border

Object

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [{
      type: "pie",
      data: [1, 2],
      highlight: {
        border: {
          width: 5,
          color: "black"
        }
      }
  }]
});
</script>

series.highlight.border.color

String

The color of the border. Accepts a valid CSS color string, including hex and rgb.

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [{
      type: "pie",
      data: [1, 2],
      highlight: {
        border: {
          color: "red",
          width: 5
        }
      }
  }]
});
</script>

series.highlight.border.opacity

Number

The opacity of the border. By default the border is opaque.

Default: 1

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [{
      type: "pie",
      data: [1, 2],
      highlight: {
        border: {
          opacity: 0.5,
          width: 5
        }
      }
  }]
});
</script>

series.highlight.border.width

Number

The width of the border in pixels. By default the border width is set to zero which means that the border will not appear.

Default: 0

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [{
      type: "pie",
      data: [1, 2],
      highlight: {
        border: {
          width: 5
        }
      }
  }]
});
</script>