1. Home
  2. Forum
  3. WinForms
  4. Use of GetValueByPoint for the secondary axis

Use of GetValueByPoint for the secondary axis

Hi Experts

I m using syncfusion tool to draw my charts. I also need to get the value of the chart on its mouse position. For that I use the function 

chartControl1.ChartArea.GetValueByPoint(e.Point);

Which gives me the value of the chart according to its mouse position. But its gives value only corresponding to the primary Y axis. I need to get that value in accordance with the secondary axis. It that possible? plz help me how can I get that.


Attachment: sc_352a6c00.zip

9 Replies 1 reply marked as answer
YP Yuvaraj Palanisamy Syncfusion Team February 3, 2022 12:47 PM UTC

Hi Dmitriy Shilin, 
 
You can get the secondary y-axis unit value by passing the mouse point to GetRealValue() method of ChartAxis as per the following code example. 
 
CodeSnippet: 
private void ChartControl1_MouseUp(object sender, MouseEventArgs e) 
{ 
    //This gives the corresponding X and Y coordinates of the mouse point. 
    Point mousePoint = new Point(e.X, e.Y); 
 
    //The GetValueByPoint method returns the X and Y values of the PrimaryYAxis calculated from the mousepoint. 
    ChartPoint PrimaryAxis = chartControl1.ChartArea.GetValueByPoint(new Point(e.X, e.Y)); 
 
    //The GetRealValue method returns the X and Y values of the corresponding axis value calculated from the mousepoint. 
    var secondaryAxisvalue = this.chartControl1.Series[1].ActualYAxis.GetRealValue(mousePoint);             
} 
 
Also, I have attached the sample for your reference, please find the sample from the below link. 
 
 
Please let us know if you have any other queries 
 
Regards, 
Yuvaraj. 


Marked as answer
DS Dmitriy Shilin February 4, 2022 10:23 AM UTC

Thank you so much Yuvaraj.

There is one more question.

I implemented the movement of a point on the chart knowing the position of the mouse if the right mouse button is clamped, since the left button is responsible for scaling the chart.

this.chartControl1.EnableXZooming = true;
this.chartControl1.EnableYZooming = true;
this.chartControl1.ResetOnDoubleClick = true;

The question is whether it is possible to create the same area as when scaling but of a different color and when you click on the right mouse button and start moving the entire series of points that fell into this new area.

Now I'm moving the point:

private bool isMouse = false;
private ChartRegion currentRegion = null;
​
private void chartControl1_ChartRegionMouseMove(object sender, ChartRegionMouseEventArgs e)
        {
            if (isMouse)
            {
                if (e.Region.SeriesIndex == 0)
                {
                    double pointY = Math.Round(chartControl1.Series[0].ActualYAxis.GetRealValue(e.Point), 1);
                    int pointX = int.Parse(Math.Round(chartControl1.Series[0].ActualXAxis.GetRealValue(e.Point)).ToString());


                    if (pointY < 0.5)
                        pointY = 0;


                    chartControl1.Series[0].Points[pointX].YValues[0] = pointY;
                }


                if (e.Region.SeriesIndex == 1)
                {
                    double pointY = Math.Round(chartControl1.Series[1].ActualYAxis.GetRealValue(e.Point), 1);
                    int pointX = int.Parse(Math.Round(chartControl1.Series[1].ActualXAxis.GetRealValue(e.Point)).ToString());


                    if (pointY < 0.5)
                        pointY = 0;


                    chartControl1.Series[1].Points[pointX].YValues[0] = pointY;
                }
                chartControl1.Redraw(true);
            }
        }

private void chartControl1_ChartRegionMouseDown(object sender, ChartRegionMouseEventArgs e)
        {
            if (e.Button == MouseButtons.Right)
            {
                if (e.Region.IsChartPoint)
                {
                    currentRegion = e.Region;
                    isMouse = true;
                    chartControl1.Series.BeginUpdate();
                }
            }
        }

        private void chartControl1_ChartRegionMouseUp(object sender, ChartRegionMouseEventArgs e)
        {
            if (isMouse)
            {
                chartControl1.Series.EndUpdate();
                isMouse = false;
            }
        }

YP Yuvaraj Palanisamy Syncfusion Team February 7, 2022 02:51 PM UTC

Hi Dmitriy Shilin, 
 
We have checked your query and we have achieved your requirement “When we select the chart region in right button and series rendered with different color for the selected region with same area” by adding the new series with selected range datapoints. Please find the code example below. 
 
CodeSnippet: 
private void ChartControl1_ChartRegionMouseUp(object sender, ChartRegionMouseEventArgs e) 
{ 
    if (isMouse) 
    { 
       
        ChartPoint start = chartControl1.ChartArea.GetValueByPoint(startPoint); 
        ChartPoint end = chartControl1.ChartArea.GetValueByPoint(e.Point); 
        var minY = start.YValues[0] < end.YValues[0] ? start.YValues[0] : end.YValues[0]; 
        var maxY = start.YValues[0] > end.YValues[0] ? start.YValues[0] : end.YValues[0]; 
        List <Model> dataCollection = new List<Model>(); 
 
        foreach (var data in this.viewModel.Data) 
        { 
            
            if (data.XValue > start.X && data.XValue < end.X && data.YValue > minY && data.YValue < maxY) 
            { 
                dataCollection.Add(data); 
            }                     
        } 
 
        ChartSeries series = new ChartSeries(); 
        series.Style.Interior = new BrushInfo(Color.Black); 
         
        ChartDataBindModel dataSeriesModel = new ChartDataBindModel(dataCollection); 
        dataSeriesModel.XName = "XValue"; 
        dataSeriesModel.YNames = new string[] { "YValue" }; 
        series.SeriesModel = dataSeriesModel; 
        series.Type = ChartSeriesType.Line; 
        this.chartControl1.Series.Add(series); 
 
        chartControl1.Series.EndUpdate(); 
        isMouse = false; 
    } 
} 
 
 
Also, we have attached the complete sample for your reference. Please find the sample from the below link. 
 
  
Output: 
 
If above solution does not meet your requirement, could you please share us detail information or pictorial representation about your requirement which will be helpful us to serve you better solution at the earliest.  
 
Regards, 
Yuvaraj. 


DS Dmitriy Shilin February 8, 2022 11:28 AM UTC

Thanks for your decision, but I wanted a slightly different result. Now clicking on the left mouse button creates a blue area for scaling ("Figure 1"), I want to press the right button and hold it also draw an area of a different color such as red, so that the user can see what he is choosing.


And as for the movement of points, it is now implemented so that when I press the right mouse button on the point and drag the mouse cursor up or down the point on the chart moves behind the cursor (I attached the code earlier).

And to move a group of points, the new area that the user creates with the right mouse button captures a group of points (I drew an example of the area captures three points "Figure 2") as soon as the user releases the mouse button the area stops drawing and all the points that have been selected begin to rise or fall along the Y axis following the mouse cursor until the user once presses the right mouse button again to finish changing the position of the group of points.


Attachment: file_1345bfbe.zip

YP Yuvaraj Palanisamy Syncfusion Team February 9, 2022 12:32 PM UTC

Hi Dmitriy Shilin, 
 
We have achieved your requirement “to press the right button and hold it to draw an area of a different color such as red, so that the user can see what he is choosing” by adding an layout in WinForms chart control. Please find the code example included in the existing sample as we provided in the previous update.  
 
CodeSnippet: 

Panel panel1;

 
private void InitializeComponent() 
{ 
    . . . 
    this. panel1 = new System.Windows.Forms.Panel(); 
} 

private void ChartControl1_ChartRegionMouseDown(object sender, ChartRegionMouseEventArgs e) 
{ 
    if (e.Button == MouseButtons.Right) 
    { 
        . . . 
 
        panel1.BackColor = Color.FromArgb(125, 255, 0, 0); 
        this.panel1.Location = e.Point; 
        this.panel1.Size = new Size(0, 0); 
        this.chartControl1.Controls.Add(panel1); 
    } 
} 
 
private void ChartControl1_ChartRegionMouseMove(object sender, ChartRegionMouseEventArgs e) 
{ 
    if (isMouse) 
    { 
        this.panel1.Size = new Size(e.Point.X - startPoint.X, e.Point.Y - startPoint.Y); 
    } 
} 
 
private void ChartControl1_ChartRegionMouseUp(object sender, ChartRegionMouseEventArgs e) 
{ 
    if (isMouse) 
    { 
        . . . 
        chartControl1.Series.EndUpdate(); 
        this.chartControl1.Controls.Remove(panel1); 
        isMouse = false; 
    } 
} 
 
Also, we have attached the modified sample for your reference. Please find the sample from the below link. 
 
Output:  
 
 
Regards, 
Yuvaraj. 


DS Dmitriy Shilin February 9, 2022 03:05 PM UTC

Thanks for your solution, it helped me, but why doesn't the panel create if I pull from the bottom corner to the top.


YP Yuvaraj Palanisamy Syncfusion Team February 10, 2022 11:00 AM UTC

Hi Dmitriy Shilin, 
 
We have modified the sample for your requirement selecting the area from bottom area to top and also attached the modified sample in the below link. 
 
 
Output: 
 
 
Regards, 
Yuvaraj. 


DS Dmitriy Shilin February 10, 2022 11:59 AM UTC

Thanks for your work, you helped me a lot. ;)


YP Yuvaraj Palanisamy Syncfusion Team February 11, 2022 10:23 AM UTC

Hi Dmitriy Shilin,  
 
We are glad to know that provided solution works at your end. Please let us know if you need any further assistance on this. 
 
Regards, 
Yuvaraj.

Loader.
Up arrow icon