CODEWITHSUNDEEP
reactjsreact-nativevictory-charts
Alwaysblue
Alwaysblue

Reputation: 11850

Victory Native area graph

I was going through Victory Native Graph Documentation and I was having tough time to comprehend.

Note: This is the first time I am working with any data Visualization library.

Anyway, So I was going through the following Section (VictoryArea)

Here In the documentation, they have only mentioned this

<VictoryChart
  theme={VictoryTheme.material}
>
  <VictoryArea
    style={{ data: { fill: "#c43a31" } }}
    data={sampleData}
  />
</VictoryChart>

Where I am unable to comprehend the value they are passing in data={sampleData} (like what does sampleData looks like?)

Consider I have data object which looks like this

{cHT: 1536892140000, cHTVU: 6519.44, cHTVF: "$6,519.44", no: 0}
1: {cHT: 1536892140000, cHTVU: 6518.97, cHTVF: "$6,518.97", no: 1}
2: {cHT: 1536892140000, cHTVU: 6521.74, cHTVF: "$6,521.74", no: 2}
3: {cHT: 1536892140000, cHTVU: 6528.73, cHTVF: "$6,528.73", no: 3}
4: {cHT: 1536892140000, cHTVU: 6531.17, cHTVF: "$6,531.17", no: 4}
5: {cHT: 1536892140000, cHTVU: 6535.07, cHTVF: "$6,535.07", no: 5}

Where cHT is the unix time (milliseconds) and cHTVU is the corresponding value ( i.e at 1536892140000 the given crypto coin had 6518.97 value)

[Question:] Now, from the above example how can I plot graph, or in-fact tell which should be pointed on x axis and Y axis?

Upvotes: 0

Views: 665

Answers (1)

boygirl
boygirl

Reputation: 26

Data in Victory is generally assumed to be an array of objects with x and y values like [{x: 1, y: 2}, {x: 2, y: 3} ...], but you can also use data accessor props to specify different attributes on your data for x and y. Check out this guide on data accessors for more information: https://formidable.com/open-source/victory/guides/data-accessors/

Upvotes: 1

Related Questions