2015-08-20 20 views
12

Va bene così ho il seguente codice:Plotly aggiornare i dati

var element = document.getElementById(scope.changeid); 

function getData(division,redraw) { 
    var employeeData = []; 
    if (!division) { 
     $http.get(api.getUrl('competenceUserAverageByMyDivisions', null)).success(function (response) { 
      processData(response,redraw); 
     }); 
    } 
    else { 
     $http.get(api.getUrl('competenceUserAverageByDivision', division)).success(function (response) { 
      processData(response,redraw); 
     }) 
    } 

} 

function processData(data,redraw) { 
    var y = [], 
     x1 = [], 
     x2 = []; 

    data.forEach(function (item) { 
     y.push(item.user.profile.firstname); 
     x1.push(item.current_level); 
     x2.push(item.expected); 
    }); 

    var charData = [{ 
      x: x1, 
      y: y, 
      type: 'bar', 
      orientation: 'h', 

      name: 'Nuværende' 
     }, { 
      x: x2, 
      y: y, 
      type: 'bar', 
      orientation: 'h', 

      name: 'Forventet' 
     }], 
     layout = { 
      barmode: 'stack', 
      legend: { 
       traceorder: 'reversed', 
       orientation: 'h' 

      } 
     }; 

    if(!redraw){ 
     Plotly.plot(element, charData, layout); 
    } 
    else 
    { 
     Plotly.redraw(element,charData,layout); 
    } 
} 

scope.$watch('divisionId', function (newValue, oldValue) { 
    if (newValue) { 
     getData(newValue.id,true); 
    } 
}, true); 

getData(null,false); 

che crea la seguente tabella:

enter image description here

Ora, come potete vedere ive aggiunto un watcher

  scope.$watch('divisionId', function (newValue, oldValue) { 
      if (newValue) { 
       getData(newValue.id,true); 
      } 
     }, true); 

Ora, quando lo faccio scattare, dovrebbe aggiornare il grafico e chiamare Plotly.redraw(element,charData,layout);

Tuttavia, quando lo fa, il grafico non cambia affatto. Non c'è nessun errore nella console quindi non sono abbastanza sicuro di cosa fare?

+1

Stai usando plotly.js in una direttiva angolare? –

risposta

13

Ho trovato la risposta alla domanda.

apprently avevo bisogno di usare:

Plotly.newPlot(element,charData,layout); 

invece di redraw

+0

Funziona, ma probabilmente non è la soluzione migliore, deve esserci un altro modo. –

+1

Hmmm ... http://www.mzan.com/article/35946484-most-performant-way-to-update-graph-with-new-data-with-plotly.shtml –

+0

Questo drenerà la memoria .. – giuseppe

12

Plotly.redraw(gd) è il modo giusto.
Ma si chiama Plotly.redraw in modo errato.
Il modo corretto è aggiornare l'oggetto data anziché un nuovo oggetto data.

var data = [ { 
    x: ['VALUE 1'], // in reality I have more values... 
    y: [20], 
    type: 'bar' 
} 
]; 
Plotly.newPlot('PlotlyTest', data); function adjustValue1(value) { 
    data[0]['y'][0] = value; 
    Plotly.redraw('PlotlyTest'); 
} 

Rif: http://www.mzan.com/article/35946484-most-performant-way-to-update-graph-with-new-data-with-plotly.shtml

Problemi correlati