search

legg / react-native-svg-d3-example-bar-chart

Example use of react-native-svg and d3 working on react-native ios/android
8 stars 1 forks source link

Is there a way to save chart to image ? #1

Closed esutton closed 7 years ago

esutton commented 7 years ago

Great example! Thank you for sharing.

I need to include a chart in a PDF report using react-native-html-to-pdf.

Any tips or links on implementing a line chart in D3?

I have been using victory-native. It is good if it has what you need and it works. The react native version is behind their react version of Victory Chart.

D3 seems attractive. I expect it is more work for myself in exchange for more control.

legg commented 7 years ago

React Native forces you to be declarative so writing out the SVG yourself is the first approach. Then use D3 as a helper for when you need to, for instance, create your x/y functions with d3-scale. The example I built took the simplest blocks example of a line chart so the amount of extra work to build the same in React Native can be seen.

Just a note on UX, mobile charts should be simple, like a sparkline style chart, less is more, so the graph should be easier to develop, unless your PMs requirements break the pattern; tail wags the dog.

Good luck with your implementation.

esutton commented 7 years ago

@legg Thank you very much for your time and advice.

Especially the UX advice on mobile charts. I will try to keep that in mind.