Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

chartjs-plugin-streaming + chartjs-plugin-zoom

(sorry for my english) I use chartjs-plugin-streaming for the real time chartjs and I want to use the chartjs-plugin-zoom.

But the zoom don't work.

When i test to zoom, appear the zoom area but on i leave the mouse from chart, nothing is happening

I see that the method doZoom of chartjs-plugin-zoom is called, then i think the problem is in streaming plugin, but I do not know where exactly.

I tested to call pause streaming before to do the zoom but there is the same problem.

What can I do to make the zoom work?

Thanks

like image 990
Jempis Avatar asked Apr 29 '26 06:04

Jempis


1 Answers

chartjs-plugin-streaming v1.6.0 now supports chartjs-plugin-zoom.

Include Chart.js, chartjs-plugin-zoom.js, chartjs-plugin-streaming.js and required libraries (Moment.js and Hammer.js), and add pan and zoom options. Note that unlike other scale types, the rangeMin and rangeMax options don't specify time values. Instead, pan.rangeMin and pan.rangeMax limit the range of the delay option value while zoom.rangeMin and zoom.rangeMax limit the range of the duration option value.

options: {
    // Assume x axis is the realtime scale
    pan: {
        enabled: true,    // Enable panning
        mode: 'x',        // Allow panning in the x direction
        rangeMin: {
            x: null       // Min value of the delay option
        },
        rangeMax: {
            x: null       // Max value of the delay option
        }
    },
    zoom: {
        enabled: true,    // Enable zooming
        mode: 'x',        // Allow zooming in the x direction
        rangeMin: {
            x: null       // Min value of the duration option
        },
        rangeMax: {
            x: null       // Max value of the duration option
        }
    }
}
like image 176
nagix Avatar answered Apr 30 '26 23:04

nagix



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!