Challenge: coding 450 charts Needed a charting graphics library
3
Current DataViz Libs
4
D3 vs React
5
Detour: decoupling visualization elements
6
Criteria for good approach
7
React + D3: Layout then Interpolate
8
Why it works well
9
Example: Pie
10
React Native Support Component injection-inject the Expo Swg components
11
Roadmap
Description:
Discover how to create reusable, animated visualization components using React and D3 in this 20-minute conference talk from React Amsterdam. Learn to overcome the challenges of combining D3's animation performance with React's declarative nature to efficiently build any imaginable visualization. Explore the process of decoupling visualization elements, understand the criteria for a good approach, and see how to effectively integrate React with D3 using the "Layout then Interpolate" method. Examine a practical example using a Pie chart and learn about React Native support through component injection. Gain insights into the speaker's experience of coding 450 charts and the need for a robust charting graphics library. Follow along as the talk covers current DataViz libraries, compares D3 and React, and outlines a roadmap for future developments in this field.