Disable clickable legend

4 posts, 0 answers
  1. RBeco
    RBeco avatar
    15 posts
    Member since:
    Apr 2013

    Posted 13 Feb 2014 Link to this post


    I am using a pie chart which by default has a clickable legend. If you click on a legend item, you filter out that data Item. However, my client doesn't want this functionality because they find it confusing that the tooltip info doesnt change (the % stays the same and is not calculated back to be a total of 100% with the remaining items).

    How do I disable this functionality? I cant find any property in the control for this.

  2. Stamo Gochev
    Stamo Gochev avatar
    173 posts

    Posted 18 Feb 2014 Link to this post


    You can attach an event handler to the legendItemClick event and prevent the default behavior (show/hide the corresponding pie segment). This could be done like this:
    <script type="text/javascript">
        function pageLoad() {
            //get a reference to the chart
            var chart = $find("Chart");
            //attach an event handler
            chart._chartObject.bind("legendItemClick", function (e) {
    I also attach a working example with the above suggestion. Could you try to use the same approach in your real scenario?

    Stamo Gochev
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
  3. Anders
    Anders avatar
    30 posts
    Member since:
    Jul 2013

    Posted 12 Feb 2016 in reply to Stamo Gochev Link to this post

    Dear Stamo Gochev

     I have used the code from your example and it works fine. But now I need to disable on one of the series and not all of them.

    Is that possible?

    Anders Pedersen

  4. Danail Vasilev
    Danail Vasilev avatar
    1502 posts

    Posted 17 Feb 2016 Link to this post

    Hi Anders,

    You can use some flag that utilizes the series item name. For example to disable the legend interaction of the second item you can use the code below:

    chart._chartObject.bind("legendItemClick", function (e) {
        if (e.text == "name 2") {

    Danail Vasilev
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top