cursor x-axis is not plotting correctly on angular the points and other has margin added to left side the mouse is on the yellow position and the crosshair layer and other please help
Hello Muhammad,
The best way to assist you if you can share the sample and steps to reproduce the issue.
You can use our online stackblitz sample as the starting point and can modify as per your requirement to share the sample with us.
https://ko.infragistics.com/products/ignite-ui-angular/angular/components/charts/chart-overview
ttps://stackoverflow.com/questions/40600192/how-to-get-mouse-position-on-transformed-html5-canvas
How to move the pointer position like this ?
The PlotAreaPosition and ChartPosition properties are actually supposed to be read-only, as they are returning where your mouse has entered the series in the case of your code-snippet here. Perhaps they aren’t because you are using the “_implementation” of the event arguments?
This still should not be necessary though, as by default, the crosshair should follow the mouse position. I have been looking into our internally logged issues, and I am now curious if you are setting any of the plotAreaMargin-related properties on the IgxDataChart? If you are, can you please provide the version of Ignite UI for Angular that you are targeting, as these properties were released awhile back while they were still in a “preview” state, and they would mess up the placement of some things in the chart.
Please let me know if you have any other questions or concerns on this matter.
Thank you for providing the version that you are using. It appears that you are a version behind the latest version of Ignite UI Angular for the charts, core, and gauges packages, as the latest version is 13.1.1. I am curious if this issue still happens for you with that version. Can you please update your packages to see if the issue still happens?
If it does, I will need you to provide the HTML markup for the chart that you are creating, as I believe that will be crucial to reproduce this behavior.
@Andrew Goldenbaum - here example
If tranformation is applied it causes some issue please help ?
Thank you for providing the StackBlitz sample. Using it, I am able to reproduce the behavior you are seeing.
Is there a particular reason that you are adding the transform: scale in this case? If this is not present, the crosshair works normally, and I feel that you can likely achieve the same behavior simply by just modifying the height and width of the IgxDataChart. If you do that instead, the chart’s crosshair continues to work correctly.
As mentioned previously, there does not exist anything that will add an offset to the crosshair.
The behavior of the crosshairs not following the mouse position when a scale transform is applied is unexpected, and as such I have asked our engineering teams to examine it further. To ensure it receives attention, I have logged it in our internal tracking system with a development ID of 274231. I have also created a private support case for you that I will be linking the issue to. This case has an ID of C-00223865 and you can access it after signing into your account, here: https://account.infragistics.com/support-cases.
@Andrew Goldenbaum - any update on this ? please help me out on this one