javascript - 切换(plotly.js - 分散)y 轴和迹线的可见性

Question

plotly.js 新手(我处于 Angular 环境中)

我想将痕迹放在多选下拉菜单中。所有 y 轴都相同。能够切换这些的可见性。建议...简单/正确的方法。

我尝试用 css 影响 svg 容器，但没有效果:

Answer 1

对于轴:

var update = {
    'yaxis.visible': false
};
Plotly.relayout(myDiv, update)

对于痕迹:

data = [
    {
        line: {width: 5},
        name: "myName1",
        type: "scatter",
        visible: "legendonly", // Plot trace but hide it to the user
        x:  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
        y:  [10, 11, 2, 23, 14, 5, 16, 7, 18, 29, 10]
    },
    {
        line: {width: 5},
        name: "myName2",
        type: "scatter",
        visible: "legendonly" ,// Plot trace but hide it to the user
        x:  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
        y:  [10, 1, 12, 13, 4, 25, 16, 17, 8, 19, 20]
    }
];

allTraces=document.getElementById("myDiv").data; // Get data from chart AFTER plotting it.

// Find index of trace-object with "name" property  = "text to find":
result = allTraces.findIndex(obj => { 
    return obj.name === "text to find";
}

// Make specified trace visible to user:
Plotly.restyle(document.getElementById("myDiv"), {"visible": true}, [result]);