mudhorn/prometheus
1
0
Fork 0
mirror of https://github.com/prometheus/prometheus.git synced 2025-03-05 20:59:13 -08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Changes

Browse source 
Signed-off-by: Julius Volz <julius.volz@gmail.com>
This commit is contained in:
Julius Volz 2019-02-15 14:26:24 +01:00
parent d9c6bb299e
commit d79ef2b7f7
1 changed files with 18 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/Graph.tsx
View file

@ -8,6 +8,7 @@ require('flot/source/jquery.flot.crosshair');
require('flot/source/jquery.flot.legend'); require('flot/source/jquery.flot.legend');
require('flot/source/jquery.flot.time'); require('flot/source/jquery.flot.time');
require('flot/source/jquery.flot.hover'); require('flot/source/jquery.flot.hover');
require('flot/source/jquery.flot.resize');
require('jquery.flot.tooltip'); require('jquery.flot.tooltip');
import metricToSeriesName from './MetricFomat'; import metricToSeriesName from './MetricFomat';
@ -111,13 +112,15 @@ class Graph extends PureComponent<GraphProps> {
mouseActiveRadius: 100, mouseActiveRadius: 100,
}, },
legend: { legend: {
container: $(this.legendRef.current as any), //show: true,
labelFormatter: (s: string) => {return '&nbsp;&nbsp;' + s} labelFormatter: (s: string) => {return '&nbsp;&nbsp;' + s},
container: this.legendRef.current!,
}, },
xaxis: { xaxis: {
mode: 'time', mode: 'time',
showTicks: true, showTicks: true,
showMinorTicks: true, showMinorTicks: true,
timeBase: 'milliseconds',
}, },
yaxis: { yaxis: {
tickFormatter: this.formatValue, tickFormatter: this.formatValue,
@ -157,7 +160,6 @@ class Graph extends PureComponent<GraphProps> {
let data = []; let data = [];
let pos = 0; let pos = 0;
const params = this.props.queryParams!; const params = this.props.queryParams!;
console.log(this.props.queryParams);
for (let t = params.startTime; t <= params.endTime; t += params.resolution) { for (let t = params.startTime; t <= params.endTime; t += params.resolution) {
// Allow for floating point inaccuracy. // Allow for floating point inaccuracy.
if (ts.values.length > pos && ts.values[pos][0] < t + params.resolution / 100) { if (ts.values.length > pos && ts.values[pos][0] < t + params.resolution / 100) {
@ -194,11 +196,24 @@ class Graph extends PureComponent<GraphProps> {
this.plot(); this.plot();
} }
componentWillUnmount() {
this.destroyPlot();
}
plot() { plot() {
this.destroyPlot();
if (this.chartRef.current === null || this.legendRef.current === null) { if (this.chartRef.current === null || this.legendRef.current === null) {
return; return;
} }
$.plot($(this.chartRef.current!), this.getData(), this.getOptions()); $.plot($(this.chartRef.current!), this.getData(), this.getOptions());
//window.addEventListener('resize', () => this.plot());
}
destroyPlot() {
const chart = $(this.chartRef.current!).data('plot');
if (chart !== undefined) {
chart.destroy();
}
} }
render() { render() {