Connecting box plot means in plotly.js

plotly.js
1

Hi,

I’m trying to connect box plot means in categorical x axis box plot

I do see this one but I don’t know if there is a official or better way to do this. Basically connecting box plot means by group.

var trace1 = {
x: [
[‘SF Zoo’,‘SF Zoo’,‘SF Zoo’,‘SF Zoo’,‘SF Zoo’,‘SF Zoo’],
[‘giraffes’, ‘orangutans’, ‘monkeys’,‘giraffes’, ‘orangutans’, ‘monkeys’]
],
y: [5, 14, 23,12,13,14,17],
boxpoints: ‘all’,
name: ‘SF Zoo’,
type: ‘box’,
boxmean:true

};

var trace2 = {
x: [
[‘LA Zoo’,‘LA Zoo’,‘LA Zoo’,‘LA Zoo’,‘LA Zoo’,‘LA Zoo’],
[‘giraffes’, ‘orangutans’, ‘monkeys’,‘giraffes’, ‘orangutans’, ‘monkeys’]
],
y: [12, 18, 29,22,11,22],
//name: ‘LA Zoo’,
type: ‘box’,
boxmean:true,

boxpoints: ‘all’

};

var trace3 = {
x: [
[‘LA Zoo’,‘LA Zoo’,‘LA Zoo’,‘LA Zoo’,‘LA Zoo’,‘LA Zoo’],
[‘giraffes’, ‘orangutans’, ‘monkeys’,‘giraffes’, ‘orangutans’, ‘monkeys’]
],
y: [12, 18, 29],
mean:true,
boxmean:true,
type: ‘scatter’
};

var data = [trace1, trace2, trace3];
var layout = {
showlegend: false,
xaxis: {
tickson: “boundaries”,
ticklen: 25,
showdividers: true,
dividercolor: ‘grey’,
dividerwidth: 3
}
};

Plotly.newPlot(‘myDiv’, data, layout);