Home > database >  React native chart kit export to pdf
React native chart kit export to pdf

Time:02-04

Is there a way to export charts to pdf in react native? Or i need to create them in html and use html-to-pdf library to create pdf?

Chart:

                            data={{
                                labels: ['Constipate', 'Normal', 'Diarrhea'],
                                datasets: [
                                    {
                                        data: [stoolBarChartData.constip, stoolBarChartData.normal, stoolBarChartData.diarrhea]
                                    }
                                ]
                            }}
                            fromZero
                            width={Dimensions.get("window").width - 40}
                            height={350}
                            showValuesOnTopOfBars={true}
                            withInnerLines={false}
                            withHorizontalLabels={false}
                            chartConfig={{
                                barPercentage: 1,
                                backgroundColor: "#0000",
                                backgroundGradientFrom: "white",
                                backgroundGradientTo: "white",
                                decimalPlaces: 0,
                                color: (opacity = 1) => `rgba(47, 80, 31, ${opacity})`,
                                labelColor: (opacity = 1) => `rgba(47, 80, 31, ${opacity})`,
                                style: {
                                    borderRadius: 16
                                },
                            }}

                            style={{
                                marginVertical: 8,
                                borderRadius: 16,
                                margin: 20,
                            }}
                        /> ```

CodePudding user response:

The only way I found is to render off-screen my charts and then take a snapshot of them with react-native-view-shot and then add them with react-native-html-to-pdf to pdf.

  •  Tags:  
  • Related