Add ability to pan & zoom on charts
This commit is contained in:
parent
ea33ba07ca
commit
d0dc61e452
|
@ -196,3 +196,4 @@ The following libraries are being used by PHP Server Monitor:
|
|||
* PHP-Pushover - https://github.com/kryap/php-pushover
|
||||
* Symfony - https://symfony.com
|
||||
* Random_compat - https://github.com/paragonie/random_compat
|
||||
* Hammer.js - https://github.com/hammerjs/hammer.js
|
|
@ -1,5 +1,7 @@
|
|||
<script type="text/javascript" src="src/templates/default/static/plugin/momentjs/moment.js"></script>
|
||||
<script type="text/javascript" src="src/templates/default/static/plugin/chartjs/chart-2.7.3.min.js"></script>
|
||||
<script type="text/javascript" src="src/templates/default/static/plugin/hammer/hammer.min.js"></script>
|
||||
<script type="text/javascript" src="src/templates/default/static/plugin/chartjs/plugin-zoom.min.js"></script>
|
||||
{% for graph in graphs %}
|
||||
<div class="chart-container col-10" style="position: relative; width:60vw">
|
||||
<canvas id="{{ graph.id }}">Your browser does not support the canvas element.</canvas>
|
||||
|
@ -72,6 +74,18 @@
|
|||
source: 'auto',
|
||||
}
|
||||
}]
|
||||
},
|
||||
plugins: {
|
||||
zoom: {
|
||||
pan: {
|
||||
enabled: true,
|
||||
mode: 'x',
|
||||
},
|
||||
zoom: {
|
||||
enabled: true,
|
||||
mode: 'x',
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
@ -133,6 +147,18 @@
|
|||
source: 'auto',
|
||||
}
|
||||
}]
|
||||
},
|
||||
plugins: {
|
||||
zoom: {
|
||||
pan: {
|
||||
enabled: true,
|
||||
mode: 'x',
|
||||
},
|
||||
zoom: {
|
||||
enabled: true,
|
||||
mode: 'x',
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue