I solved it by generating the data as intended originally by plotly (Box plots in JavaScript) rather than as suggested by in Post 87948.
So, I use a query that generates the raw data, with their values, their groups (the box they belong to, string), and a label for each value (also string).
Then I use:
var groups = data.series[0].fields[0].values;
var vals = data.series[0].fields[1].values;
var labels = data.series[0].fields[2].values;
var uniqueGroups = [...new Set(groups)].sort();
const partition = (vals, labels, groups) => {
return vals.reduce((acc, v, i) => {
acc[uniqueGroups.indexOf(groups[i])][0][0].push(vals[i]);
acc[uniqueGroups.indexOf(groups[i])][0][1].push(labels[i]);
return acc;
}, Array.from(Array(uniqueGroups.length), () => new Array(Array.from(Array(2), () => new Array(0)))));
}
var partitions = partition(vals, labels, groups);
var traces = [...Array(uniqueGroups.length).keys()].reduce((acc,v,i) => {
acc.push({
name: uniqueGroups[i],
y: partitions[i][0][0],
text: partitions[i][0][1],
type: "box",
jitter: 0.3,
pointpos: 0,
boxpoints: 'Outliers',
});
return acc}, []
);
return {
data : traces,
config : {
displayModeBar: false
},
layout: {
xaxis: {
type: "float"
},
yaxis: {
title: "[sec]"
}
}
}