javascript - CanvasJsは、マウスが凡例ポイントの上にあるときにチャートの特定の行を非表示にします

Question

凡例を含む複数の折れ線グラフを作成しましたが、次に作成できるかどうかに興味があります: マウスが凡例の任意の点の上にある場合、この凡例の点に属していないグラフのすべての線が非表示になるか、単に見えなくなりますか?

例を書いていただければ幸いです。

Answer 1

凡例アイテムのマウスオーバーおよびマウスアウトで、そのvisibleプロパティをfalse / trueに設定することにより、任意のdataSeriesを非表示/再表示できます。ここにjsfiddleがあります

function onMouseOver(e) {
    for(var i = 0; i < e.chart.options.data.length; i++) {
        if (e.dataSeries !== e.chart.options.data[i]) {
            e.chart.options.data[i].visible = false;
        } else {
            e.dataSeries.visible = true;
        }
    }
    e.chart.render();
}

function onMouseOut(e) {
    for( var i = 0; i < e.chart.options.data.length; i++){
        e.chart.options.data[i].visible = true;
        chart.render();
    }
}