Remove autorange grid

plotly.js
1

Hi,
i’m starting using plotly.js but i have a problem to hide a vertical range grid (The white ones in the image).
Is someone has a issue to this problem?
Sincerely

11
Capture d’écran 2019-09-15 à 19.07.11.png1862×954 36.3 KB

The code is:

function getData() {
    return Math.random();
}

var layout = {
    yaxis: {
        title: 'Mb/s',
        color: 'transparent',
        showgrid: false,
        zeroline: false,
        showline: false,
        tickcolor: 'transparent',
        gridcolor: 'transparent',
        zerolinecolor: 'transparent',
        tickcolor: 'transparent',
        visible: false,
    },
    xaxis: {
        visible: false,
        showgrid: false,
        zeroline: false,
        showline: false,
        visible: false,
        tickcolor: 'transparent',
        gridcolor: 'transparent',
        zerolinecolor: 'transparent',
        tickcolor: 'transparent',
        color: 'transparent'
    },
    autozize: true,
    paper_bgcolor: 'transparent',
    plot_bgcolor: 'transparent',
    margin: {
        l: 0,
        r: 0,
        t: 0,
        b: 0,
        pad: 0
    },
    height: 200,
    hoverinfo: 'none',


};

Plotly.plot('downloadChart',[{
    y:[getData()],
    fill: 'tozeroy',
    type: 'scatter',
    fillcolor: '#3AC1FA',
    line: {
        color: '#3AC1FA'
    },
    mode: 'lines'
}], layout, {responsive: true});

var cnt = 0;
setInterval(function(){
    Plotly.extendTraces('downloadChart',{ y:[[getData()]]}, [0]);
    cnt++;
    if(cnt > 25) {
        Plotly.relayout('downloadChart',{
            xaxis: {
                range: [cnt-25,cnt]
            }
        });
    }
},1000);
2

Plotly.relayout is tricky - instead of

{
    xaxis: {
        range: [cnt-25,cnt]
    }
}

try:

{
    'xaxis.range': [cnt - 25, cnt]
}

The one you have will replace the whole xaxis object (leaving only the new range, none of the other settings) whereas 'xaxis.range' will replace only the range.

3

Thank you, i’ts working perfectly!