plotly.js reduziert den Spielraum zwischen yAchse Titeln und den Achsnummern

Question

Ich mag die Spanne zwischen dem yAchse Titel reduzieren zu können und den Achsnummern, ich kann jede Eigenschaft oder Funktion in plotly.js Dokumentation findet es

Erwähnen

ein Beispiel für den Code hier

var trace1 = { 
 
    x: [0, 1, 2, 3, 4, 5, 6, 7, 8], 
 
    y: [0, 1, 2, 3, 4, 5, 6, 7, 8], 
 
    name: 'Name of Trace 1', 
 
    type: 'scatter' 
 
}; 
 
var trace2 = { 
 
    x: [0, 1, 2, 3, 4, 5, 6, 7, 8], 
 
    y: [1, 0, 3, 2, 5, 4, 7, 6, 8], 
 
    name: 'Name of Trace 2', 
 
    type: 'scatter' 
 
}; 
 
var data = [trace1, trace2]; 
 
var layout = { 
 
    title: 'Plot Title', 
 
    xaxis: { 
 
    title: 'x Axis', 
 
    titlefont: { 
 
     family: 'Courier New, monospace', 
 
     size: 18, 
 
     color: '#7f7f7f' 
 
    } 
 
    }, 
 
    yaxis: { 
 
    title: 'y Axis', 
 
    titlefont: { 
 
     family: 'Courier New, monospace', 
 
     size: 18, 
 
     color: '#7f7f7f' 
 
    } 
 
    } 
 
}; 
 
Plotly.newPlot('myDiv', data, layout);

auch hier ist ein Codepen Link codepen

Answer 1

Soweit ich weiß, können Sie es nicht direkt tun, aber Sie haben mindestens zwei Möglichkeiten, siehe die Diskussion here.

Sie die Achse bewegen direkt

document.getElementsByClassName('ytitle')[0].y.baseVal[0].value *= 1.1 

oder eine annotation zu layout hinzufügen und seine Position

annotations: [ 
    { 
    x: 0.5, 
    y: -0.15, 
    xref: 'paper', 
    yref: 'paper', 
    text: 'I am not an axis label', 
    showarrow: false, 
    } 
] 

var trace1 = { 
 
    x: [0, 1, 2, 3, 4, 5, 6, 7, 8], 
 
    y: [0, 1, 2, 3, 4, 5, 6, 7, 8], 
 
    name: 'Name of Trace 1', 
 
    type: 'scatter' 
 
}; 
 
var trace2 = { 
 
    x: [0, 1, 2, 3, 4, 5, 6, 7, 8], 
 
    y: [1, 0, 3, 2, 5, 4, 7, 6, 8], 
 
    name: 'Name of Trace 2', 
 
    type: 'scatter' 
 
}; 
 
var data = [trace1, trace2]; 
 
var layout = { 
 
    title: 'Plot Title', 
 
    xaxis: { 
 
    title: 'x Axis', 
 
    titlefont: { 
 
     family: 'Courier New, monospace', 
 
     size: 18, 
 
     color: '#7f7f7f' 
 
    } 
 
    }, 
 
    yaxis: { 
 
    title: 'y Axis', 
 
    titlefont: { 
 
     family: 'Courier New, monospace', 
 
     size: 18, 
 
     color: '#7f7f7f' 
 
    } 
 
    }, 
 
    annotations: [ 
 
    { 
 
     x: 0.5, 
 
     y: -0.15, 
 
     xref: 'paper', 
 
     yref: 'paper', 
 
     text: 'I am not an axis label', 
 
     showarrow: false, 
 
    } 
 
    ] 
 
}; 
 
Plotly.newPlot('myDiv', data, layout); 
 
document.getElementsByClassName('ytitle')[0].y.baseVal[0].value *= 1.1

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script> 
 
<div id="myDiv" style="width: 100%; height: 500px;"></div>