Box plot (dispersion)

Dashboard
1

Hello everyone,

I'm looking for a Box-Plot Chart in Node-Red Dashboard.
I didn't find any useful information with a google search, can someone help me ?

I'm looking for something like this

I wonder if it is possible to work with template node to obtain a boxplot...

Thanks in advance for your answers

Ricardo.

2

It seems to me that with the Plotly charting library it should be possible. It can be used with ui_template node and requires intermediate level skills of coding.

3

Thanks a lot!

For example this.

<head>
	<!-- Load plotly.js into the DOM -->
	<script src='https://cdn.plot.ly/plotly-2.12.1.min.js'></script>
</head>

<body>

  <div id="myDiv"><!-- Plotly chart will be drawn inside this DIV --></div>
  <script>
  
 var x = ['day 1', 'day 1', 'day 1', 'day 1', 'day 1', 'day 1',
         'day 2', 'day 2', 'day 2', 'day 2', 'day 2', 'day 2']

var trace1 = {
  y: [0.2, 0.2, 0.6, 1.0, 0.5, 0.4, 0.2, 0.7, 0.9, 0.1, 0.5, 0.3],
  x: x,
  name: 'kale',
  marker: {color: '#3D9970'},
  type: 'box'
};

var trace2 = {
  y: [0.6, 0.7, 0.3, 0.6, 0.0, 0.5, 0.7, 0.9, 0.5, 0.8, 0.7, 0.2],
  x: x,
  name: 'radishes',
  marker: {color: '#FF4136'},
  type: 'box'
};

var trace3 = {
  y: [0.1, 0.3, 0.1, 0.9, 0.6, 0.6, 0.9, 1.0, 0.3, 0.6, 0.8, 0.5],
  x: x,
  name: 'carrots',
  marker: {color: '#FF851B'},
  type: 'box'
};

var data = [trace1, trace2, trace3];

var layout = {
  yaxis: {
    title: 'normalized moisture',
    zeroline: false
  },
  boxmode: 'group'
};

Plotly.newPlot('myDiv', data, layout);


</script>
</body>
1 Like
4

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.