I am trying to create the UI to show the X and Y axis line graph using Svg Charts in React Native as above attached screenshot. I have an array for the x and y-axis respectively. Example:

var xAxisData = [1.002, 1.045, 1.084, 2.08, 2.021, .... so on]  // price list

var yAxisData = [12-11-2021, 13-11-2021, 14-11-2021, 18-11-2021, .... so on]  // dates

I have plotted the y-axis graph for that, had filtered & sort the array on the basis of date and some interval so will show only some dates as intervals on the y-axis for example my start date is 20 April and the end date is 20 July. The plotted y-axis will be shown as for only 4 dates as 4 intervals in the period of 4 months.

But now need to plot the x-axis graph, I am getting stuck on what basis will filter or sort the x-axis array within some interval or value.

Note: I Don't want to show or plot all the values of the array for the x and y-axis. My requirement is needed to show the values of the x and y-axis at some intervals

Can anyone help with the same?