How you set a fixed x-axis with dynamic data?

[nbhector]

Hi,

I am using the LineMarkSeries and I am feeding the data parameter with a new object (i.e. {x: cnt; y: getData()} ) and I am trying to get a fixed axis in the range from 0 to 20. However, it seems a bit difficult since the dynamic data is creating a new object containing new data points to be rendered on the graph. Does anyone know how I can fix this issue?

Thanks!

[nbhector]

Okay, so I figured out how to make the axis have a predetermined scale. However, the way the graph renders every second doesn't seem to map to the tick value. For example, the first data point is {x: 1, y: 0.7}, so I expect the graph to render at the first tick. However, it gets rendered to the last tick value. The first data point will eventually reach the first tick value once all the data points have been added to the array. Does anyone know how I can fix that issue?

[saurabhgupta050890]

Try
<XYPlot height={200} width={200} xDomain={[0, 20]}> <MarkSeries data={data} /> </XYPlot>
https://github.com/uber/react-vis/blob/master/docs/scales-and-data.md