just like in subject. I read documentation from plotly but i did not found any helpfull information. Maybe someone know how to add title to each plot in PLOTLY JS ?
2 Answers
At the moment you can,t set the subplot title directly.
But you can set subplot title using annotation text.
Hear is a example
//Set annotations text in layout configuration
annotations: [{
text: "First subplot",
font: {
size: 16,
color: 'green',
},
showarrow: false,
align: 'center',
x: 0.13, //position in x domain
y: 1, //position in y domain
xref: 'paper',
yref: 'paper',
},
{
text: "Second subplot",
font: {
size: 16,
color: 'orange',
},
showarrow: false,
align: 'center',
x: 0.9, //position in x domain
y: 1, // position in y domain
xref: 'paper',
yref: 'paper',
}
]
Comments
There's a feature request on github. In this discussion another workaround was posted by nicolaskruchten: https://github.com/plotly/plotly.js/issues/2746#issuecomment-810195118. It's still using annotations but referencing the axes domains. This has the advantage of a proper positioning relative to the subplot and the annotation stays fixed even on zooming.
Defining a domain on the axis you want to position the title (the domain is the "share" of the whole plotly canvas the subplot axis is :
layout: {
xaxis: {
domain: [0,0.48] ,
},
xaxis2: {
domain: [0.52, 1],
}
}
the annotation itself can reference the domain on this (or both) axis:
annotations: [
{
text: "X1 title",
x: 0,
xref: "x domain",
},
{
text: "X2/Y2 title",
x: 0,
xref: "x2 domain",
}
]
