ItemLabel for SelectedItem Only

5 posts, 0 answers
  1. Abdulhameed
    Abdulhameed avatar
    27 posts
    Member since:
    Jul 2010

    Posted 02 Jan 2012 Link to this post

    I am creating a pie Chart where I have almost 8 section, showing all label doesn't look very nice so I decided to show the label for the selected item only.

    How can I display item label for the selected item only?

    Thanks
  2. Petar Marchev
    Admin
    Petar Marchev avatar
    968 posts

    Posted 04 Jan 2012 Link to this post

    Hi Abdulhameed,

    I am not sure I understand you fully. You mentioned that showing all labels does not look very nice. Are you showing the value in the labels? Or are you showing some text (like a category name).

    If you are showing category name - I would suggest not to show this category name in the item label, but show it in the legend and in the item label show the value.

    If you are showing values in the item labels - I do not see an obvious reason not to like the results. If you can clear that, than we might be able to help. You can send us a screenshot of the output and a drawing of the desired results.

    Now, for the second part of your question - yes there is way to show the label of a particular slice. It can not be achieved with out-of-the-box means but you can implement it manually. You just need to find the hovered item in code behind and set its labels visibility to Visible (and collapse all others).

    The code below should help you understand what I have in mind.
    public MainPage()
    {
     InitializeComponent();
     
     this.radChart.SeriesMappings[0].SeriesDefinition.InteractivitySettings.HoverScope = Telerik.Windows.Controls.Charting.InteractivityScope.Item;
     this.radChart.DefaultView.ChartArea.HoverChanged += new EventHandler<Telerik.Windows.Controls.Charting.ChartHoverChangedEventArgs>(ChartArea_HoverChanged);
    }
     
    void ChartArea_HoverChanged(object sender, Telerik.Windows.Controls.Charting.ChartHoverChangedEventArgs e)
    {
     ChartArea chartArea = sender as ChartArea;
     
     if (chartArea == null)
     {
      return;
     }
     
     var hoveredDataItems = e.HoveredItems.Select(dp => dp.DataItem);
     
     foreach (var item in chartArea.ChildrenOfType<SeriesItemLabel>())
     {
      if (hoveredDataItems.Contains(item.DataPoint.DataItem))
      {
       item.Visibility = System.Windows.Visibility.Visible;
      }
      else
      {
       item.Visibility = System.Windows.Visibility.Collapsed;
      }
     }
    }
      
    You can examine our demos here where you can also get some new ideas.
     

    All the best,
    Petar Marchev
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  3. DevCraft banner
  4. Abdulhameed
    Abdulhameed avatar
    27 posts
    Member since:
    Jul 2010

    Posted 07 Jan 2012 Link to this post

    I have attached a screen shot of my Pie Chart as you can see the chart is very corded and even when I tried the spider mood it didn't display all labels properly may be because of space availability.
    My goal is to hide all labels except selected slice.

  5. Petar Marchev
    Admin
    Petar Marchev avatar
    968 posts

    Posted 11 Jan 2012 Link to this post

    Hi,

    Indeed the chart looks crowded. Is it possible to make it bigger?

    In my previous response I provided you with some code to help you only show the hovered item's label. Did you try this approach for your project?

    Here is one more thing you can try. Set the ChartArea's property SmartLabelsEnabled to true.

    If this doesn't help you can also consider using a horizontal bar series instead.

    Kind regards,
    Petar Marchev
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  6. Abdulhameed
    Abdulhameed avatar
    27 posts
    Member since:
    Jul 2010

    Posted 28 Jan 2012 Link to this post

    Actually I changed it to bar chart. however I don't see a need to only show labels to hovered items because to achieve this I could simply enable tooltip
     
Back to Top
DevCraft banner