Plotting sporadic data in react-native-chart-kit

Question

I've recently started playing around with react-native and have been looking into graph/chart libraries for an app idea I have.

I'm really liking the look of react-native-chart-kit however one thing I cant work out is how to plot a series of data where there are gaps in the data.

For example, if I was plotting a line graph of rainfall every day for a month but didn't record any data on weekends then I would like to have a straight line from Fridays point to Mondays point whilst keeping space for Saturday and Sunday.

Currently The closest I've gotten is adding a special value of -1 to my series of data whenever there isn't an entry then adding all indexes with a value of -1 to an array which is used with the hidePointsAtIndex field to hide these entries however this just prevents a dot from being rendered on these points, it does not prevent the line from passing through them.

Is there a way to achieve what I am trying to do with this library? Alternatively, is there a library better suited to graphing the sort of data I am using?

Apologies if this is a basic question/asked in a stupid way, I'm new to the world of graphing data so there may well be some terminology that I've gotten wrong.

Thanks for your help

Answer 1

I'm still open to suggestions on how to get this working with react-native-chart-kit but I've managed to achieve the result I was after using react-native-svg-charts. While it's not quite as nice looking it's far easier for me to mess with CSS than graph generation code.

For reference, this is what I was trying to achieve: