Mousewheel zoom and zooming on mobile devices

timok · **Joined:** Mon Jun 27, 2024 10:05 am **Posts:** 3

Hello,

I evaluated the chart library today and like it very much. The documentation is perfect.
There are just some points (at the moment) I am not completely happy with:

- when i use the mousewheel to zoom into the chart, it always zooms into the center of the chart. It would be nice if it zooms into the position of the mouse pointer.

- we also want to use this library for mobile devices (iOS, Android...). I did not find a possibility to zoom the chart on these devices.

- is it possible to have the legend as a static element below the x axis? It sometimes covers a series and it cannot be dragged away on android or iOS devices.

- the snap to the points is not very easy on mobile devices with small displays. I know about the property "proximity_snap", but if I set this to 15 for example, snap works well. But if the points are very near to each other, it seems to snap to the most left point within the 15 pixel radius. It would be nice if the snap goes to the nearest point within this radius around the click event.

- is it possible to have the vertical axis caption turned by 90° like the highcharts library is doing? I've seen it's a <span> element and the CSS3 transform properties are not yet compatible with every browser, but maybe it's possible to draw it onto the canvas?

Thanks & best regards,

Timo Krieger

JDees · **Joined:** Tue May 10, 2024 10:57 am **Posts:** 6

Timo,

Mouse-wheel scrolling - We will look into this for a future release, but not the next major release. Thanks for pointing this out, though, as this seems to be a more logical way of doing this type of zooming.

iOS/Android/etc. - We are currently working on support for touch-enabled devices. This will include gestures (if the browser supports them) or other slightly modified ways of achieving the same basic functionality that currently exists in the standard browser version. This functionality will be included in the next major release.

Legend - This is something we have wanted to work on for a while now, and have had other priorities in the way. We are hoping to incorporate different styles of legends in a future release, and will be working on this as soon as possible, but at this time I can not guarantee that they will make it into the next major release.

Point selection - We did a lot of work on fixing issues with point selection in v2.2 which was just released. Now that we are working on touch-enabled support, we will be taking another look at point selection to assure that it will work well with these devices.

Axis captions - We have been working on this as well, and it will be incorporated into the next major release.

timok · **Joined:** Mon Jun 27, 2024 10:05 am **Posts:** 3

Hello,

I found two more things today:

- the zoom gesture by dragging the mouse just works if I drag the mouse from the top left to the bottom right. Any other direction opens the zoom area but does not zoom in.

- I have a temperature chart wich has it's maximum at about 36.9°C and a minimum at 24.2°C. I don't set the max and min extremes so the y axis scales automatically to exact these values. This works fine if i just use a line chart, but if I enable drawPoints, the points are cut off at the maximum and minimum value. It's not critically since you can see the values, but it does not look very nice. The best solution i could think of would be to scale the y axis to the next integer value (+/-1), so for our example to 38°C and 23°C. You can see this in the attached screenshot.

Best regards,
Timo

JDees · **Joined:** Tue May 10, 2024 10:57 am **Posts:** 6

We will take a look into fixing this issue for a future release.
For now you can add padding to the series options like:

Code:

var series = chart.addSeries(
    new EJSC.ScatterSeries(
        new EJSC.ArrayDataHandler( [[0,0],[1,2],[2,1]] ) ,
        {
            pointSize: 10 ,
            __padding: { x_min: 20, x_max: 20, y_min: 20, y_max: 20 }
        }
    )
);