Dygraph dynamic update legende Werte verschwinden

Ich verwende einen Dygraph, um eine CSV-Datei zu überwachen und die dynamische Update-Funktion zu verwenden. Wenn ich den Mauszeiger über den Graphen bewege, um die Werte der Kurven in der Legende anzuzeigen, verschwinden sie, sobald der Graph aktualisiert wird, was ein wenig nervig ist.Dygraph dynamic update legende Werte verschwinden

<html> 
<head> 
<script type="text/javascript" src="/static/dygraph-combined.js"></script></head> 
<body> 
<div id="psu"></div> 
<script type="text/javascript"> 
    g = new Dygraph(document.getElementById("psu"), "/data/psu", 
    { 
     legend: 'always', 
     hideOverlayOnMouseOut: false, 
     ylabel: 'current (A)', 
     height: 480, 
     width: 640, 
     sigFigs: 2, 
     title: 'power interface monitor', 
     xValueFormatter: Dygraph.dateString_, 
     xAxisLabelFormatter: Dygraph.dateString_, 
     xTicker: Dygraph.dateTicker 
    }); 
    window.intervalId = setInterval(function(){g.updateOptions({ 'file': "/data/psu" }); }, 1000); 
</script> 
</html>

So ist die grafische Darstellung ist alles korrekt angezeigt wird und die Daten aktualisiert werden, werden nur die Legende Werte verschwinden, nachdem der Graph mit g.updateOptions() aktualisiert wird. Ich dachte, vielleicht kann ich eine Art von "mouseover" Ereignis nach g.updateOptions() wieder auslösen, so dass die Werte zurückkommen, aber es könnte eine sauberere Art und Weise, es zu tun.

Danke.

Quelle

2016-07-14 Christoph Larndorfer

Ich habe eine Lösung für mein Problem gefunden, aber ich bin mir nicht sicher, wie gut es implementiert ist. Ich teile es hier so andere könnte es finden:

$(document).ready(function() { 
 
    var data = []; 
 
    var t = new Date(); 
 
    for (var i = 10; i >= 0; i--) { 
 
    var x = new Date(t.getTime() - i * 1000); 
 
    data.push([x, Math.random()]); 
 
    } 
 

 
    var last_mousemove_evt = null; 
 
    var on_graph = false; 
 

 
    var g = new Dygraph(document.getElementById("div_g"), data, { 
 
    legend: 'always', 
 
    drawPoints: true, 
 
    showRoller: true, 
 
    valueRange: [0.0, 1.2], 
 
    labels: ['Time', 'Random'], 
 
    highlightCallback: function(e, x, pts, row) { 
 
     last_mousemove_evt = e; 
 
     on_graph = true 
 
    }, 
 
    unhighlightCallback: function(e) { 
 
     on_graph = false; 
 
    } 
 
    }); 
 
    // It sucks that these things aren't objects, and we need to store state in window. 
 
    window.intervalId = setInterval(function() { 
 
    var x = new Date(); // current time 
 
    var y = Math.random(); 
 
    data.push([x, y]); 
 
    g.updateOptions({ 
 
     'file': data 
 
    }); 
 
    if (on_graph) { 
 
     g.mouseMove_(last_mousemove_evt); 
 
    } 
 
    }, 1000); 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/dygraph/1.1.1/dygraph-combined.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
 
<div id="div_g" style="width:600px; height:300px;"></div>

Also habe ich am Ende mit der highlightCallback und unhighlightCallback Optionen, damit ich die Maus kann Position herauszufinden und nach einer dynamischen Aktualisierung Aufruf dann die dygraph.mouseMove_() Funktion, um die Legendenwerte neu zu zeichnen. Scheint zu arbeiten.

Bitte lassen Sie mich wissen, wenn es eine bessere Lösung gibt. Es könnte gut sein, diese Funktionalität standardmäßig in die dygraph.updateOptions() einzuschließen, da es merkwürdig erscheint, dass die Legendenwerte nach einem Update verschwinden.

Quelle

2016-08-06 10:14:35

Dygraph dynamic update legende Werte verschwinden

Antwort

Verwandte Themen