Change cursor on series hover

[Prashant]

Hi,

We want to implement drill down functionality on series item (bar) click. For that we want to change mouse cursor to pointer on chart series item hover. When
mouse moves out of series, cursor should be set to default.

How can I achieve this?


Thanks,
Prashant Gham

[Iliana Dyankova]

Hi Prashant,

This scenario is not supported by Kendo UI Chart, however we will consider this idea for future releases. Meanwhile as a possible workaround I can suggest attaching a handler to the seriesHover event and change the mouse cursor using the following code snippet:

$("#chart").kendoChart({
  //...
  seriesHover: function(){
     $("#chart").css("cursor", "pointer");
  }
});

, however there is no an event which fires when the mouse cursor moves out the series and the cursor cannot be set back to default. 

Regards,
Iliana Nikolova
Telerik

 

 

[Adrien]

Hi,

This CSS snippet does the job:

path[data-model-id]{
    cursor: pointer;
}
path[fill-opacity='0']{
    cursor: default;
}

Adrien

[Joel]

This does not work, when adding this class to Vue Component's style section

[Neli]

Hi Joel, 

Are you using the Kendo UI for jQuery in a Vue app or you are using the Kendo Vue components?

For questions related to the Kendo UI for Vue you can search or post the issues in the dedicated forum:

- https://www.telerik.com/kendo-vue-ui

Regards,

Neli