Plotly barchar generates an incorrect visualization

plotly.js
1

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

image
image.png3654×616 53.5 KB

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

2

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

image
image.png1863×382 17.5 KB

3

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!

4

the latest version plotly.js@1.39.1

5

Even Codepen is having the same issue

image
image1437×807 94.9 KB

6

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

7

@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.