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

Select

events

Fired when the user modifies the selection.

The range units are:

Generic axis - Category index (0-based)
Date axis - Date instance

The event handler function context (available via the this keyword) will be set to the widget instance.

select

Event Data

e.axis `Object`

The target axis configuration.

e.from `Object`

The lower boundary of the selected range.

e.sender `kendo.dataviz.ui.Chart`

The widget instance which fired the event.

e.to `Object`

The upper boundary of the selected range.

The last selected category is at index [to - 1] unless the axis is justified. In this case it is at index [to].

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [
    { data: [1, 10] }
  ],
  categoryAxis: {
    categories: [2011, 2012, 2013],
    select: {
      from: 1,
      to: 5
    }
  },
  select: function(e) {
/* The result can be observed in the DevTools(F12) console of the browser. */
    console.log(e.from, e.to);
  }
});
</script>

<div id="chart"></div>
<script>
function chart_select(e) {
/* The result can be observed in the DevTools(F12) console of the browser. */
  console.log(e.from, e.to);
}
$("#chart").kendoChart({
  series: [
    { data: [1, 10] }
  ],
  categoryAxis: {
    categories: [2011, 2012, 2013],
    select: {
      from: 1,
      to: 5
    }
  }
});
var chart = $("#chart").data("kendoChart");
chart.bind("select", chart_select);
</script>

Select

select

Event Data

e.axis Object

e.from Object

e.sender kendo.dataviz.ui.Chart

e.to Object

e.axis `Object`

e.from `Object`

e.sender `kendo.dataviz.ui.Chart`

e.to `Object`