uber / react-vis

Data Visualization Components

Home Page:https://uber.github.io/react-vis

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Strings not accepted by Vertical/HorizontalBarSeries on x / y

DistantStatic opened this issue · comments

I am attempting to pass strings for the x or y value (depending on Vertical or Horizontal).

In the documentation the following data is used as an example:
[{x: 'winter', y: 10}, {x: 'spring', y: 100}, {x: 'summer', y: 10000}, {x: 'fall', y: 10}]

The following the data I am passing:
[{x: "Al Qusayr", y: 67.304099121099}, {x: "Aleppo", y: 513.549}, {x: "Bassel Al-Assad", y: 786.18481982422}, {x: "Hama", y: 765.55572253418}, {x: "Hatay", y: 72.886288574219}, {x: "Incirlik", y: 569.508}, {x: "Jirah", y: 100}, {x: "Minakh", y: 25}]

And here is the jsx for the plot and series:
<XYPlot width={800} height={400} > <VerticalBarSeries animation data={myData} /> <XAxis title="Base ID" /> <YAxis title="Fuel - Tons"/> </XYPlot>

Below is the error received:
Received NaN for the x attribute. If this is expected, cast the value to a string.

Without strings there is no issue. I have also passed strings in the same manner to other series like the LabelSeries via the label attribute and there is no issue with it understanding the string in that case.

I also encountered this problem. Turns out you need to add xType="ordinal" props in XYPlot for ordinal type data

Reference: https://livecodestream.dev/post/7-react-chart-libraries-for-your-web-projects/#:~:text=react%2Dvis%20is%20a%20library,other%20common%20data%20visualization%20formats.

I also encountered this problem. Turns out you need to add xType="ordinal" props in XYPlot for ordinal type data

Reference: https://livecodestream.dev/post/7-react-chart-libraries-for-your-web-projects/#:~:text=react%2Dvis%20is%20a%20library,other%20common%20data%20visualization%20formats.

Great, this works, thank you!