Quartz / Chartbuilder

A front-end charting application that facilitates easy creation of simple beautiful charts
http://quartz.github.io/Chartbuilder
MIT License
2.1k stars 354 forks source link

Problem with decimals #189

Open adrianblanco opened 8 years ago

adrianblanco commented 8 years ago

When you introduce decimal numbers in Chartbuilder, it takes and visualize them as whole numbers. So, it is not possible right now to visualize decimal numbers. Hope it helps. Thanks!

yanofsky commented 8 years ago

Hi @a-br can you post your data?

adrianblanco commented 8 years ago

Hi @yanofsky Sorry for the late reply. Sure, here you are a snapshot of the problem and the random data I have used to show it. The issue occurs when you mixed decimals with whole numbers. Chartbuilder takes and visualizes decimals as whole numbers.

Also, another small issue is using a language with accent marks. You can see that the font changes when there is a mark above a letter.

Data:

City    Price
Barcelona   2.95
Málaga 1.55
Madrid  2.69
León   10

Snapshot:

chartbuilder 2 0

Hope it can helps to your improvement!

yanofsky commented 8 years ago

Sorry for my late reply! What's the issue here?

That the y-axis doesn't have decimals? That the points aren't labeled?

As for the accents, that appears to be a font issue. If you change your styles to use a different font does the problem persist?

ecun1 commented 8 years ago

The problem is that 2.95 is not recognized as a number between 2 and 3. Instead it is ignoring the dot as a seperator and displays it as 295.

The only number correctly displayed is the 10. I have the same problem. In Germany the tasks of a comma and a dot are different from the US system.

Are these seperators saved somewhere?

yanofsky commented 8 years ago

Oh, now i see. Chartbuilder is supposed to be able to determine what type of number format your browser uses (but not your data) but it relies on toLocaleString() which isn't implemented correctly on some browsers.

The determination of separators is done here https://github.com/Quartz/Chartbuilder/blob/879112e5b48dcdbfc0620b9ff1508516f1b211cf/src/js/stores/SessionStore.js#L85-L102

(which is then passed through to here https://github.com/Quartz/Chartbuilder/blob/3b34357ce767eced71d3eedb2425f32a1c406a00/src/js/util/parse-delimited-input.js#L13)

Any ideas on better ways to auto-determine the number formatting convention being used?

ecun1 commented 8 years ago

I guess a switch would be the easiest solution (12.345,67 or 12,345.67).

For this specific case one could also look for two and three digit numbers in the data as they easily indicate which character is used for indicating values below 1. Example: 2.63 is obviously not 263. "." becomes the seperator for values below 1.

Or maybe look at a certain value in the data containing both seperators. The seperator that appears first is for the thousands, the one that appears last is for the values below 1.

(I am just starting to code, but I think that could work)

yanofsky commented 8 years ago

2.36 is obviously 2 + 36/100 2,36 is obviously 2 + 36/100 but 236,159 could either be 236 + 159/1000 or 236159 236.159 could either be 236 + 159/1000 or 236159

The logic you suggest would work in some cases, but it would still be ambiguous if numbers only had one separator, i.e it's entirely integers less than 1 million but greater than -1 million or entirely numbers greater than -1000 and less than 1000 with fewer than three-digit decimal precision.

I think the best we we could do is put in a warning message that the data is of an ambiguous magnitude.