Donut Chart Tool Tip Position is Inconsistent.

2 posts, 0 answers
  1. Kyle
    Kyle avatar
    7 posts
    Member since:
    Aug 2017

    Posted 05 Nov 2018 Link to this post

    I found this problem on a simple donut chart I was creating, but found that the demo linked below has the same issue:

    https://demos.telerik.com/aspnet-mvc/donut-charts/donut-labels

    When hovering over each of the categories in the chart, the proximity of the tool tip to the graph is inconsistent.  The 'tennis', 'basketball' and 'rugby' tool tips are a few pixels of white space away from the graph, the tool tip for 'volleyball' is a bit closer to the graph and the corner of the tool tip for 'football' is touching the graph.

    Ultimately, I would like a way to make the spacing to be consistent.  However, if there is a way to increase the amount of space to ensure that none of the tool tips are touching the graph that would work as well.

    Thanks!

     

  2. Stamo Gochev
    Admin
    Stamo Gochev avatar
    208 posts

    Posted 07 Nov 2018 Link to this post

    Hello,

    Currently, there isn't a built-in way to customize the tooltip position, so the what I can recommend is to use CSS to adjust the position to some extent, e.g.:
    <style>
        .k-tooltip {
            margin-left: -5px;
            margin-top: -10px;
        }
    </style>
    Another option is to implement your own custom tooltip by using the following articles as a reference:

    https://docs.telerik.com/kendo-ui/controls/charts/how-to/integration/tooltip-for-category-axis-labels
    https://docs.telerik.com/kendo-ui/controls/charts/how-to/interaction/show-tooltip-on-click

    You can also submit your idea as a feature request in the Feeedback Portal:

    http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback

    Regards,
    Stamo Gochev
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top