Search code examples
react-nativehybrid-mobile-appreact-native-gifted-charts

How to show multiple lines in linechart using react-native-gifted-chart


enter image description here

I want to display four lines on a line chart using react-native-gifted-chart. Specifically, I need to show two lines using primary data (data, data1) and two lines using secondary data(secondaryData) because the labels for the primary and secondary datasets will be different. However, when I attempted this, I couldn't get the values from data2 to appear on the graph if I used secondaryData. Please help Thanks


Solution

  • You can use the dataSet prop instead of data. The dataSet will be an array of 4 objects representing the 4 lines. So you will not need to use data1, data2 or secondaryData.

    In the dataSet array, add the property isSecondary: true to the two sets which you want to make secondary.

    I have also replied to the issue you raised on the Github repo- How to create 4 line graph 2 with primary and 2 with secondary data