Is there a practical upper limit on how many data rows Charts.css can handle?

[rayluo]

Charts.css works well for small dataset with one or two dozens of rows. Today I tried a table with 50 rows. The line chart still shows a decent line, however, the data values are confined inside their very narrow "strip", therefore all digits are displayed digit-by-digit, from top to bottom. I know I could use hide-data show-data-on-hover to make them less ugly, but it won't really fix the problem. Is there any better solution, other than using a different mechanism to display value on hover, by using tooltips?

And the primary axis labels have the same problem. UPDATE: But I think that's understandable and acceptable. Charts.css would just need to make the labels to display lower, below the primary axis.

The situation would become much worse, when the table contains hundreds of rows. (_{The line would not even be visible. UPDATE: The line would be visible, as long as I disable show-data-axes. So, that part is fine.})

Is that a practical upper limit that the users should be aware of?

[ramiy]

@rayluo

Thank you for bringing to my attention all of these extreme use-cases.

The framework should have a solution for those edge-cases. To display the data & labels outside of the regular flow. Currently tooltips do it well. I need to develop a new class to be use in data and in labels.

Task added to my TODO list. I will keep you updated when I will have a working solution.

[rayluo]

Currently tooltips do it well.

FYI: The tooltip workaround only works fine for column chart and bar chart. If, however, it is a line chart or area chart with multiple datasets, only 1 series of tooltip will be shown, at the middle height of the chart. (Even so, that is already better than no tooltips at all. According to the official doc, tooltip is not even expected to be available for line chart and area chart.)

[ramiy]

Yes, I know the limits of the internal tooltips. I want to add documentation to integrate external libraries into Charts.css to enhance the visibility. This should also decrease the file size, removing external functionality not related to charts.

Meanwhile, try using Hint.css to improve your charts.