Plot that makes no sense

Community Help
1

I am trying to paint this dataset.

csv = `date,count
2022-12-08,600
2022-12-14,634
2023-01-01,698
2023-01-03,701
2023-01-04,704
2023-01-06,717
2023-01-16,1751
2023-01-23,815
2023-01-26,839
2023-02-01,862
2023-02-04,883
2023-02-05,892
`

And the graph that I get makes no sense.

image
image727×406 17.7 KB

My past experience tells me that the problem is with type conversion, but even if Observable just draws strings here, why the sudden spike at 1751 mark? Why 1751 > 600 while 815 < 600 here?

There is a small yellow warning sign next to the graph. However, it doesn’t have any message attached to explain what should I do.

2

To fix the types, you could use:

d3.csvParse(csv, d3.autoType)

When the values are strings, they are ordered in alpha-numerical ascending order, meaning “1751” comes before “600”.

There should be a title on the small yellow warning, suggesting to look at the browser’s console for more information. The console has the following warnings:

Capture d’écran 2023-02-05 à 13.04.22
Capture d’écran 2023-02-05 à 13.04.222440×208 72.9 KB

2 Likes
3

So it sorts the strings, and then maps line at X to the position of the string on the Y axis.

I believe there is a CSS problem with that thing.

image

If the cursor is in this shape, no message is shown.

4

The window or tab needs to have focus:

5

That’s not it. Cursor can take this shape even if the tab is focused. Also the reaction time is too slow.