Commit 7609832b authored by sebastien letort's avatar sebastien letort

closes #299. Graphs are destroyed when asking for new ones.

parent dfe574c2
Pipeline #64211 failed with stage
......@@ -2,6 +2,8 @@
// NOTE : nothing yet.
// AUTHORS : sebastien.letort@irisa.fr
"use strict";
// ===========================================
function get_random_color()
{
......@@ -43,15 +45,16 @@ class Metrics
this.type = null;
this.d_legend = { position:'top' };
this.chartjs = null;
this._setAPI
this._setChartjsData( d_app['data'] );
console.log( this.constructor.name + ": chartjs_data = " + JSON.stringify(this.chartjs_data) );
//~ console.log( this.constructor.name + ": chartjs_data = " + JSON.stringify(this.chartjs_data) );
}
}
Metrics.prototype.build_chart = function( id )
{
let ctx = $(id)[0].getContext('2d');
let local_options = {
legend: this.d_legend,
title :
......@@ -73,7 +76,7 @@ Metrics.prototype.build_chart = function( id )
};
const options = Object.assign( {}, local_options, this.options ); // merge of 2 javascript objects.
let chart = new Chart( ctx,
this.chartjs = new Chart( ctx,
{
type: this.type,
data: this.chartjs_data,
......@@ -102,7 +105,6 @@ class PerUserPlot extends Metrics
};
}
}
PerUserPlot.prototype._setChartjsData = function( l_data )
{
function __dictionnarize2( l_data, key, l_periods )
......@@ -290,6 +292,17 @@ LaunchedPlot.prototype._setChartjsData = function( l_data )
// ===========================================
// ===========================================
// ===========================================
// Note: I need to store Chart object to destroy them when redrawing
// cf: https://stackoverflow.com/questions/40056555/destroy-chart-js-bar-graph-to-redraw-other-graph-in-same-canvas
// cf: https://stackoverflow.com/questions/24815851/how-to-clear-a-chart-from-a-canvas-so-that-hover-events-cannot-be-triggered
// Note: another solution could be to update chart if they exist.
const D_CHARTS = {
// api keyword : [ html elt id, js class, object ]
'per_user' : [ '#per_user_plot', PerUserPlot, null ],
'per_state': [ '#per_state_plot', PerStatePlot, null ],
'launched' : [ '#launched_plot', LaunchedPlot, null ],
};
function build_API_url( which_chart )
{
// get valuable info from form
......@@ -314,13 +327,6 @@ function build_API_url( which_chart )
function draw_plots()
{
const D_CHARTS = {
// api keyword : [ html elt id, js class ]
'per_user' : [ '#per_user_plot', PerUserPlot ],
'per_state': [ '#per_state_plot', PerStatePlot ],
'launched' : [ '#launched_plot', LaunchedPlot ],
};
for( let which_chart in D_CHARTS )
{
let API_URL = build_API_url( which_chart );
......@@ -341,10 +347,13 @@ function draw_plots()
// code for ChartJS
for( let app in json )
{
let [id,cstr] = D_CHARTS[which_chart];
let [id,cstr,obj] = D_CHARTS[which_chart];
if( obj )
obj.destroy();
//~ console.log( id );
let o_plot = new cstr( app, json[app] );
o_plot.build_chart( id );
D_CHARTS[which_chart][2] = o_plot.chartjs;
}
},
function( reason )
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment