Black Lives Matter. Please consider donating to Black Girls Code today.

Plotly barchar generates an incorrect visualization

I have a very weird behavior with plotly. It looks to me as if the barchar is plotted wrong:

The bars should be ordered in descending order based on the counts, but they have… random values. Funny enough, if the code has some 20 bars or less, then everything is fine…

I work with barcharts that are ten of thousands large.

Code:

var trace1 = {
  x: ['xd8', 'x50', 'x76', 'x0f', 'xaa', 'xbf', 'x3f', 'x11', 'x06', 'x3b', 'x52', 'xc2', 'x8e', 'x68', 'x5d', 'x7f', 'x37', 'x44', 'x03', 'xb9', 'xff', 'x90', 'xf4', 'xf2', 'xf6', 'x4b', 'xb7', 'x0b', 'x98', 'x85', 'x81', 'xb6', 'xe2', 'xa5', 'x10', 'x09', 'xae', 'x5e', 'x0d', 'xa6', 'x96', 'x10', 'x84', 'xc9', 'x2b', 'x2b', 'x0f', 'x2a', 'x1c', 'x33', 'xab', 'xd4', 'x5e', 'x3d', 'xc7', 'x68', 'x06', 'x28', 'xe0', 'x15', 'x48', 'xc9', 'xe6', 'x00', 'x89', 'x9b', 'x98', 'x85', 'x48', 'xfd', 'x02', 'xf1', 'xdb', 'xbe', 'x9f', 'xd2', 'x03', 'xb6', 'xfd', 'x6b', 'x97', 'x99', 'x91', 'x41', 'x75', 'xea', 'xfc', 'xf1', 'x64', 'xc9', 'x0e', 'x06', 'x1b', 'x15', 'xa9', 'x97', 'x7f', 'xb8', 'x1b', 'x17'],
  
  y: [7139, 6173, 5920, 5777, 5712, 5655, 5496, 5348, 5316, 5245, 5223, 4885, 4777, 4722, 4542, 4133, 4106, 3994, 3921, 3841, 3832, 3743, 3415, 2892, 2875, 2856, 2650, 2617, 2501, 2330, 2223, 2092, 2031, 1963, 1849, 1833, 1730, 1709, 1700, 1665, 1478, 1381, 1324, 1274, 1079, 1023, 929, 785, 753, 744, 682, 571, 470, 398, 354, 243, 217, 204, 181, 177, 176, 173, 171, 164, 162, 161, 155, 146, 139, 139, 136, 135, 125, 115, 114, 110, 109, 107, 103, 98, 98, 93, 84, 84, 82, 82, 81, 80, 78, 75, 75, 73, 73, 72, 71, 71, 71, 67, 67, 67],
  mode: 'markers',
  type: 'bar',
  orientation: 'v'
};



var data = [ trace1 ];

var layout = {
  title:'Line and Scatter Plot',
  // this works
  xaxis: {
    categoryorder: 'array',
    categoryarray: ['xd8', 'x50', 'x76', 'x0f', 'xaa', 'xbf', 'x3f', 'x11', 'x06', 'x3b', 'x52', 'xc2', 'x8e', 'x68', 'x5d', 'x7f', 'x37', 'x44', 'x03', 'xb9', 'xff', 'x90', 'xf4', 'xf2', 'xf6', 'x4b', 'xb7', 'x0b', 'x98', 'x85', 'x81', 'xb6', 'xe2', 'xa5', 'x10', 'x09', 'xae', 'x5e', 'x0d', 'xa6', 'x96', 'x10', 'x84', 'xc9', 'x2b', 'x2b', 'x0f', 'x2a', 'x1c', 'x33', 'xab', 'xd4', 'x5e', 'x3d', 'xc7', 'x68', 'x06', 'x28', 'xe0', 'x15', 'x48', 'xc9', 'xe6', 'x00', 'x89', 'x9b', 'x98', 'x85', 'x48', 'xfd', 'x02', 'xf1', 'xdb', 'xbe', 'x9f', 'xd2', 'x03', 'xb6', 'xfd', 'x6b', 'x97', 'x99', 'x91', 'x41', 'x75', 'xea', 'xfc', 'xf1', 'x64', 'xc9', 'x0e', 'x06', 'x1b', 'x15', 'xa9', 'x97', 'x7f', 'xb8', 'x1b', 'x17']
  }
};

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

(originally created in python )

import plotly
plotly.version

‘3.0.0’

I generated the figures in https://codepen.io/etpinard/pen/YrEeGG?editors=1010

Hmm. Pasting your trace in a codepen (https://codepen.io/etpinard/pen/QBjqWO?editors=1010) gives me:

Nice! Thanks a lot for help!!!

What version of plotly is there (as I have installed the library through pip/anaconda)?

I even increased the number of data points substantially (like 100K)… And it seems to work there…

This could be because I had duplicate labels in Xaxis most probably!

the latest version plotly.js@1.39.1

Even Codepen is having the same issue

just checked… why do you have ‘x0f’ 2 times in both the categoryarray and the x array assignment?

@etienne: thanks a lot for the version number. Do you know how the versions relate to other python/R platforms?

@mkarhade: duplicates are very bad, I agree.