Chart Notes

6 posts, 0 answers
  1. Erkin
    Erkin avatar
    8 posts
    Member since:
    Dec 2016

    Posted 29 Dec 2016 Link to this post

    Hello,

    I was wondering if there is the capability in chartview for a user to select a portion of a line in a line series and add a permanent tooltip or note that they can fill in with text? 

    An example is attached.

     

    Thank you,

     

    Erkin

  2. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3903 posts

    Posted 30 Dec 2016 Link to this post

    Hello Erkin,

    Thank you for writing.  

    RadChartView provides a tooltip interactivity with the ChartTooltipController. Additional information is available here: http://docs.telerik.com/devtools/winforms/chartview/features/tooltip

    However, this will show a tooltip whenever the user hovers a data point. It is not possible to select a part of the series and add a permanent tooltip. For this purpose, it may be useful to use one of the annotations according to your custom requirement: http://docs.telerik.com/devtools/winforms/chartview/features/annotations/annotations

    I hope this information helps. Should you have further questions I would be glad to help.

    Regards,
    Dess
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Erkin
    Erkin avatar
    8 posts
    Member since:
    Dec 2016

    Posted 03 Jan 2017 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    Dess,

     

    Thanks for your reply. Is there any way to have the user enter text to label the annotation, or is it just simply a highlighted area without any text?

     

    Thanks,

     

    Erkin

  4. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3903 posts

    Posted 05 Jan 2017 Link to this post

    Hello Erkin, 

    Thank you for writing back. 

    CartesianGridLineAnnotations have a Label  property which allows you to specify some text according to your requirements. However, this text is not designed to be editable by the user. You can refer to our Demo application >> ChartView >> Cartesian Annotations example which demonstrates different annotations with text. The demo application is available in the installation folder of the suite which is usually at the following path: C:\Program Files (x86)\Telerik\UI for WinForms R3 2016\Examples\QuickStart\Bin

    I hope this information helps. If you have any additional questions, please let me know. 

    Regards,
    Dess
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Erkin
    Erkin avatar
    8 posts
    Member since:
    Dec 2016

    Posted 05 Jan 2017 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    Dess,

    Thank you for your response. Unfortunately that does not solve the problem that the company I am working for has. They need a specific action for the user to set permanent tool tips (separate from the ones automatically generated) and annotate them with their own text like in the picture I attached in the first post.

    The company has bought the software for Winforms already and plans to use it on a current application. The application allows the user to right click onto a point and from a context menu select add a note. This note would then be able to be annotated by the user and the text written would connect to that specific point as a permanent "tool tip" or note that the user could see. The note would also follow this point as it is attached to the specific point in the series. Is there a way the development team can include this type of action to the software in a near future build?

     

    Thank you,

     

    Erkin

  6. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3903 posts

    Posted 06 Jan 2017 Link to this post

    Hello Erkin, 

    Thank you for writing back. 

    The provided detailed explanation is greatly appreciated. RadChartView doesn't offer such functionality out of the box. However, I can suggest you the illustrated behavior in the attached gif file which is achieved by the following code snippet:
    public RadForm1()
    {
        InitializeComponent();
        LineSeries lineSeries = new LineSeries();
        lineSeries.ShowLabels = true;
        lineSeries.PointSize = new SizeF(8, 8);
        lineSeries.DataPoints.Add(new CategoricalDataPoint(20, "Jan"));
        lineSeries.DataPoints.Add(new CategoricalDataPoint(22, "Apr"));
        lineSeries.DataPoints.Add(new CategoricalDataPoint(12, "Jul"));
        lineSeries.DataPoints.Add(new CategoricalDataPoint(19, "Oct"));
        this.radChartView1.Series.Add(lineSeries);
         
        foreach (CategoricalDataPoint p in lineSeries.DataPoints)
        {
            p.Label = "";
        }
        this.radChartView1.ContextMenuOpening += radChartView1_ContextMenuOpening;
          
        this.radChartView1.LabelFormatting += radChartView1_LabelFormatting;
     
        RadMenuItem item = new RadMenuItem("Annotate");
        item.Click += item_Click;
        menu.Items.Add(item);
    }
     
    private void item_Click(object sender, EventArgs e)
    {
        if (lastClickedPoint != null)
        {
            lastClickedPoint.Label = lastClickedPoint.Value.ToString();
            lastClickedPoint = null;
        }
    }
     
    private void radChartView1_LabelFormatting(object sender, ChartViewLabelFormattingEventArgs e)
    {
        CategoricalDataPoint dataPoint = e.LabelElement.DataPoint as CategoricalDataPoint;
        e.LabelElement.Text = dataPoint.Value.ToString();
        e.LabelElement.BackColor = Color.Transparent;
        e.LabelElement.BorderColor = Color.Black;
    }
     
    RadContextMenu menu = new RadContextMenu();
    CategoricalDataPoint lastClickedPoint = null;
     
    private void radChartView1_ContextMenuOpening(object sender, ChartViewContextMenuOpeningEventArgs e)
    {
        Point mouseLocation = radChartView1.PointToClient(Cursor.Position);
     
        CategoricalDataPoint dataPoint = radChartView1.View.Renderer.HitTest(mouseLocation.X, mouseLocation.Y) as CategoricalDataPoint;
         
        if (dataPoint != null)
        {
            e.ContextMenu = menu;
            lastClickedPoint = dataPoint;
        }
    }

    I hope this information helps. If you have any additional questions, please let me know. 

    Regards,
    Dess
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top