We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Data Point Selection and chart data source change. Tooltip with other info source.

Hello, sorry for my english. There are 2 questions, information on which I could not find myself.

1. How can I show a tooltip with information from a data source that is not involved in plotting? There is a list of incoming data (1) and a list with already made calculations(2). The graph is based on data from the second list(2), but at the tooltip I want to show information from the list with the input data(1) that was used to calculate the second list(2).

2. When I select a graph column, I get its index. Using an index, I consider the percentage of the selected column to the remaining columns. After calculations, I change the YBindingPath and get the graph I need with comparative data (example in the screenshots). But due to the fact that the initially selected column has a value of 0%, I cannot click on the column and deselect it. To get the initial schedule, I have to double click on another column in the percent mode. Is it possible to display a vertical cancel button in place of a column with 0%? Perhaps there is a more correct way to return the original schedule? I add a part of my code.

Thank you in advance.



Attachment: cs_code_319962d2.rar

5 Replies

BK Bharathiraja K Syncfusion Team February 20, 2019 10:12 AM UTC

Hi Denys, 
 
Greetings from Syncfusion. Please find the response for your requirement below here. 
 
Query 1: show the tooltip with information from a data source that is not involved in plotting? 
We can achieve your requirement by using the TooltipCreated event. 
 
Please refer the below code snippet.  
Code Snippet [C#]: 
chartArea.TooltipCreated += ChartArea_TooltipCreated; 
 
private void ChartArea_TooltipCreated(object sender, SfChart.TooltipCreatedEventArgs e) 
{ 
            var ser = e.P1.Series; 
            var data = e.P1.Series.ItemsSource as ObservableCollection<Model>; 
            if(ser.SelectedDataPointIndex > 0) 
                e.P1.Label =  data[ser.SelectedDataPointIndex].Area.ToString(); 
} 
 
Please refer below UG link for more details: 
 
Query 2: Is it possible to display a vertical cancel button in place of a column with 0%? 
 
We can achieve your requirement by using the ChartAnnotation. We can add the annotation at the “0” value. And by using the AnnotationClicked event we can deselect the selected segment. 
 
Please refer the below code snippet.  
 
Code Snippet [C3]: 
chartArea.AnnotationClicked += ChartArea_AnnotationClicked; 
 
private void ChartArea_AnnotationClicked(object sender, ChartAnnotationClickedEventArgs e) 
{ 
       //add your code here    
} 
 
Code Snippet [C#]: 
void Chart_SelectionChanged(object sender, SfChart.SelectionChangedEventArgs e) 
{ 
         …….        
         if (viewModel.compares[idxArea].InPercent == 0 && e.P1.SelectedDataPointIndex == idxArea) 
         { 
                 VerticalLineAnnotation lineAnnotation1 = new VerticalLineAnnotation() { StrokeWidth = 10, StrokeColor = Color.Transparent }; 
                 lineAnnotation1.X1 = idxArea; 
                 lineAnnotation1.Y1 = 0; 
                 lineAnnotation1.Text = "0 % "; 
                 lineAnnotation1.LabelStyle.TextSize = 20; 
                 lineAnnotation1.LabelStyle.VerticalLabelAlignment = ChartAnnotationAlignment.End; 
                 lineAnnotation1.LabelStyle.HorizontalLabelAlignment = ChartAnnotationAlignment.Center; 
                 chartArea.Annotations.Clear(); 
                 chartArea.Annotations.Add(lineAnnotation1); 
          } 
          ….. 
} 
 
We have prepared a sample for your requirement and it can be downloaded from the below link. 
 
Please refer below UG link for more details: 
 
Query:  To get the initial schedule, I have to double click on another column in the percent mode 
 
Since we are not clear with this query, could you please share more information about your exact requirement. It will be more helpful to analyze and provide you solution. 
 
Please let us know if you need any further assistance. 
 
Regards, 
Bharathiraja. 



DE Denys February 22, 2019 07:50 AM UTC

Hello, thanks for your help and the sample provided. There are still a few questions that I could not solve.

Annotation. 
1. How to make the click on the annotation do the actions I need, and then delete the annotation itself?
2. If you click on the column with the highest value, the annotation is not visible, see screenshot1.

Tooltip.
1. Is it possible to show a tooltip not on a click, but on a long tap?
2. In the sample, the tooltip for the first column displays incorrect information, see screenshot2.
3. Is it possible to show information in this way:
There is a List1 <T1> with two objects: "quantity" and "diameter". And there is a List2 <T2> with the object "area".
We construct the graph according to the data of the List2 <T2> object "area". Is it possible then in the tooltip to display information in two lines, like this:
"quantity" = value from List1 <T1>
"diameter" = value from List1 <T1>






BK Bharathiraja K Syncfusion Team February 26, 2019 10:21 AM UTC

Hi Denys, 
 
Please find the response for your requirement below here. 
 
Query: Using Annotation  
 
We have used the DataMarkerCreated Event to show a Text “0 %” instead of using the chart Annotation for the column with 0 value. This will display text for the column with the highest value proper. 
 
Please refer the below code snippet for more details: 
 
Code Snippet [C#]: 
seriesArea.DataMarkerLabelCreated += SeriesArea_DataMarkerLabelCreated; 
 
private void SeriesArea_DataMarkerLabelCreated(object sender, ChartSeries.DataMarkerLabelCreatedEventArgs e) 
{ 
     var data = e.DataMarkerLabel.Data as Model; 
     if (data != null && (chartArea.Series[0] as ColumnSeries).YBindingPath ==       
              "InPercent" && data.InPercent == 0) 
     { 
         TextView text = new TextView(this) { Text = "0 %", Rotation = -90 }; 
         text.SetTextColor(Color.Black); 
         text.Click += Text1_Click; 
         e.DataMarkerLabel.View = text;//Add text for the column with 0 value 
     } 
} 
 
private void Text1_Click(object sender, EventArgs e) 
{ 
      //Do your action in here and delete the text created 
      var textView = sender as TextView; 
      textView.Text = string.Empty; 
      textView = null; 
} 
 
 
Tooltip: 
 
Query: 1. Is it possible to show a tooltip not on a click, but on a long tap? 
We would like to let you know the behavior of chart tooltip, the tooltip will display only when tap any column segment and this is the default behavior of the tooltip. There is no long press option. 
 
You can use the tooltip show and hide method of tooltip programmatically. Please refer the below UG link for more details. 
UG link: 
 
Query 2: In the sample, the tooltip for the first column displays incorrect information, see screenshot2. 
The tooltip value shows wrong value for the first index due the index value is checked with the 0 value. Now we have changed it with -1 and it will work proper for the first column. 
 
Query 3: 
We have displayed the tooltip with the data from the List<T> of data with Quantity and Diameter using the ToolTipCreated event. 
 
Please refer the below code snippet: 
Code Snippet [C#]: 
private void ChartArea_TooltipCreated(object sender, SfChart.TooltipCreatedEventArgs e) 
{ 
       var ser = e.P1.Series; 
       var data = e.P1.Series.ItemsSource as ObservableCollection<Model>; 
       if (ser.SelectedDataPointIndex > -1) 
            e.P1.Label = data[ser.SelectedDataPointIndex].Area.ToString() +  
               " Quantity :" + data[ser.SelectedDataPointIndex].Quantity.ToString() + 
               " Diameter :" + data[ser.SelectedDataPointIndex].Diameter.ToString(); 
} 
 
 
Please refer below UG link for more details:  
  
We have prepared a sample for your requirement and you can download the sample from the below link. 
 
 
Regards, 
Bharathi 



DE Denys March 4, 2019 11:07 AM UTC

Thank you very much for your help and samples, everything works perfectly.




BK Bharathiraja K Syncfusion Team March 5, 2019 08:54 AM UTC

Hi Denys, 
 
Thanks for your feedback. As always, we are happy to assist you. 
 
Regards, 
Bharathiraja. 


Loader.
Live Chat Icon For mobile
Up arrow icon