# How to get x and y axis values from user selected area

### Welcome to the SciChart Forums!

• Some reputation is required to post answers. Get up-voted to avoid the spam filter!
• We welcome community answers and upvotes. Every Q&A improves SciChart for everyone
0
0

Scenario: user selects an area of a heatmap chart using a box annotation via a mouse drag.

I have created a custom modifier to draw the box annotation. I’ve used this as the basis: SimpleDataPointSelectionModifier.ts

My question is: how to I get the X axis start + end values and the Y axis start + end values based on the area of the annotation/mouse coordinates.

Thanks

Version
1.4.1575
• You must to post comments
0
0

Hi Henrique,

That should be pretty easy, and we do something similar to that already in SimpleDataPointSelectionModifier.ts.

``````const { xCalc, yCalc } = this.getDefaultCoordCalculators();
if (!xCalc) {
return;
}
this.selectionAnnotation.x2 = xCalc.getDataValue(translatedPoint.x); // Convert point.x to X Data Value
this.selectionAnnotation.y2 = yCalc.getDataValue(translatedPoint.y); // Convert point.y to Y Data Value

function getDefaultCoordCalculators() {
const xAxis = this.parentSurface.xAxes.get(0);
const yAxis = this.parentSurface.yAxes.get(0);
if (!xAxis || !yAxis) {
return { xCalc: undefined, yCalc: undefined };
}

const xCalc = xAxis.getCurrentCoordinateCalculator();
const yCalc = yAxis.getCurrentCoordinateCalculator();

return { xCalc, yCalc };
}
``````

Note it gets a little more complex in multi-axis scenarios. The coordinate calculator instance is for the current axis and current draw phase only.

Best regards,
Andrew

• Thanks for your response Andrew, using this example code on our heatmap results in the annotation displayed in the wrong location. I’ve attached a video to show this.
• You must to post comments
0
0

Thanks for your response Andrew, using this example code on our heatmap results in the annotation displayed in the wrong location. I’ve attached a video to show this.

• You must to post comments
0
0

Hi Henrique, can’t see the video but it’s possible that you need to translate mouse-coordinates (which are relative to the parent SciChartSurface) to the inner seriesViewRect.

More info in the documentation page here: Converting Pixel Coordinates to data Values

Scroll down to this part:

Transforming Pixels to the ViewRect

Functions exist to translate a point from the parent canvas of the chart to the viewRect. This is useful if you want to transform a mouse-coordinate on the parent canvas into a data-value on the chart….

If you are still stuck share a short code sample with the current behaviour and expected behaviour and we can find you a solution.

Best regards,
Andrew

• You must to post comments
Showing 3 results