ダイナミックダイナミックアップデートの凡例値が消えます

グラフを使用してCSVファイルをモニタし、ダイナミックアップデート機能を使用しています。グラフの上にカーソルを置くと、凡例の曲線の値が表示されますが、グラフが更新されるとすぐに消えてしまいます。少し面倒です。ダイナミックダイナミックアップデートの凡例値が消えます

<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>

ので、グラフはすべて正しく表示され、データが更新されるグラフがg.updateOptions()で更新された後、唯一の凡例の値が消えます。私はおそらくg.updateOptions()の後に何らかの種類の"mouseover"イベントを再トリガーすることができると考えていたので、値は戻ってきましたが、よりクリーンな方法があるかもしれません。

ありがとうございました。

出典

2016-07-14 Christoph Larndorfer

問題の解決方法を見つけましたが、実装方法がわかりません。私は他の人がそれを見つけるかもしれないので、ここでそれを共有する：

$(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>

私はマウスの位置を把握し、動的更新呼び出しの後にすることができますので、だから私はhighlightCallbackとunhighlightCallbackオプションを使用して終了、その後dygraph.mouseMove_()凡例の値を再描画する関数です。仕事をしているようだ。

解決策がより適切かどうかお知らせください。アップデート後に凡例の値が消えてしまうのが奇妙なので、この機能をデフォルトでdygraph.updateOptions()に含めるとよいでしょう。

出典

2016-08-06 10:14:35

ダイナミックダイナミックアップデートの凡例値が消えます

答えて

関連する問題