I am trying to implement the following functionality requested by our users:
Zoom:
– Only zoom the chart when using CTRL + MouseWheel key
– This is similar to how most browsers behave
Pan/Scroll:
– If no CTRL key is pressed, then pan/scroll
– This is similar to how most browsers behave
Given the above requirement, I started by creating custom modifier by extending YAxisDragModifier.
My code almost works:
– When using CTRL + Mouse Left & Drag, it Scales (zooms) — just like the user wants
– But using CTRL + Mouse Wheel does not do the same — it only Scales (Zooms).
I have uploaded the code at codesandbox.io:
https://codesandbox.io/s/amazing-shape-2ispt0?file=/src/customModifiers.ts
Note that I have not tried to implement this in ZoomPanModifier yet, but would be helpful if you could give me some pointers on getting this feature in there too.
I would appreciate any help I can get and thanks a bunch in advance.
Best Regards,
Sachin Patel.
- sachin patel asked 1 year ago
- last active 1 year ago
Hello, I have added YAxisDragModifier and ZoomPanModifier to my surface and when I try to drag on Y axis I can move the X axis too and that is not the behavior that I was trying to get. I want when I drag/move YAxis not to move on the YAxis also.
Here is my code:
Surface.ChartModifiers.Add(new PinchZoomModifier());
Surface.ChartModifiers.Add(new ZoomExtentsModifier());
Surface.ChartModifiers.Add(new YAxisDragModifier { DragMode = AxisDragModifierBase.AxisDragMode.Pan });
Surface.ChartModifiers.Add(new XAxisDragModifier { DragMode = AxisDragModifierBase.AxisDragMode.Pan, ClipModeX = ClipMode.None });
Surface.ChartModifiers.Add(new ZoomPanModifier
{
Direction = Direction2D.XDirection,
ZoomExtentsY = false
});
Here is the video with the behavior:
VIDEO: https://drive.google.com/file/d/1kbYi2voKNvHD5J7D6-XDw7OJx4IwlEqr/view
Help please!
- Ilija Kocev asked 5 years ago
- last active 5 years ago