Menu
How does on remove the title from a plotly js chart?
Example chart I have is as follows
<head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<div id="myDiv" style="width: 800px; height: 400px;"></div>
<script>
var trace1 = {
x: [1, 2, 3, 4],
y: [10, 15, 13, 17],
mode: 'markers'
};
var trace2 = {
x: [2, 3, 4, 5],
y: [16, 5, 11, 9],
mode: 'lines'
};
var trace3 = {
x: [1, 2, 3, 4],
y: [12, 9, 15, 12],
mode: 'lines+markers'
};
var data = [ trace1, trace2, trace3 ];
var layout = {
title:false
};
Plotly.newPlot('myDiv', data, layout);
</script>
This chart will have a title "false", I have also tried var layout = { showtitle:false }
setting the title to null: title:'' or simply removing the title line, doesn't display a title, but the title area which is approxiamtely 50px in height above the chart reserved for the title remains, how do I remove this title area?
403
Plotly. newPlot('myDiv', data, layout, {displaylogo: false});
Just add displayModeBar: false to the config object and it will disable the floating toolbar in Plotly.
To disable zoom and panning you need to set: layout. xaxis. fixedrange = true and layout.
@alexpetit12 You can set the font color for the entire title not only for substrings of it. layout=go. layout(title = dict(text ='Your title', font =dict(family='Sherif', size=14, color = 'red')), ... ) for more title attributes see https://plot.ly/python/reference/#layout-title.
By removing the title from the layout config it will no longer render it. However, the margins are still configured to create the space for it. You will need to override those default margins as explained here.
I have created a jsFiddle showing that config applied to generate the desired output.
This is the meat of it:
var layout = {
margin: {
l: 50,
r: 50,
b: 50,
t: 50,
pad: 4
}
};
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
