Thank you very much for this. With React 18 on NextJS 12, I was really short on chart options, with a looming deadline, and the docs examples for Visx are so bloated you're likely to hit another dependency that doesn't play well with React 18 yet (react-spring), so this really saved me.
just looking for some charts lib that is customizable and "simple" enough and this seems that works well with nextjs - I would recommend omit react-spring entirely, on the video he is using svg primitives so you can animate them with framer-motion
just a show idea, but just learned about react-virtual today, and except for a near 3-hour video from Kent C. Dobb's, I really don't see any tutorials on it. It's a nice replacement for react-windows etc
Excellent as usual. How do you compare this with recharts. Again I learnt about recharts from you only. My impression or POV I guess if you want more finer control and customization fir your charts visx may be more suitable. Recharts though has some low level apis it's still not providing this level of fine grained control
Thanks Tarun! I agree, recharts is probably the way to go if you want a simple pie chart... it's a great package. But if you want full control, visx seems like a great option!
Nice as an example, but what about the UX for keyboard and screen reader users? How could we make the “hover” actually accessible? Or can they tab to the individual pie values somehow?
Hey Kai! I honestly haven't really had a use for a candlestick chart yet... I guess I don't do much financial/investment applications where you're tracking a low/high range over a period of time.
Great video, as always. Would love to see more visx chart tutorials
Thanks James! I’ll do my best!
Interesting stuff Leigh!
Thank you
Thanks Igor!
Excellent work, exactly what I needed !
Excellent!!
Thank you very much for this. With React 18 on NextJS 12, I was really short on chart options, with a looming deadline, and the docs examples for Visx are so bloated you're likely to hit another dependency that doesn't play well with React 18 yet (react-spring), so this really saved me.
just looking for some charts lib that is customizable and "simple" enough and this seems that works well with nextjs - I would recommend omit react-spring entirely, on the video he is using svg primitives so you can animate them with framer-motion
just a show idea, but just learned about react-virtual today, and except for a near 3-hour video from Kent C. Dobb's, I really don't see any tutorials on it. It's a nice replacement for react-windows etc
Excellent as usual. How do you compare this with recharts. Again I learnt about recharts from you only. My impression or POV I guess if you want more finer control and customization fir your charts visx may be more suitable. Recharts though has some low level apis it's still not providing this level of fine grained control
Thanks Tarun! I agree, recharts is probably the way to go if you want a simple pie chart... it's a great package. But if you want full control, visx seems like a great option!
Wondering if you know or can share how visx copes with big data?
Oh nice, but do you have a clue to render an image on the chart path?
You can, but it’s too low-level you have to check their docs and play with it
Nice as an example, but what about the UX for keyboard and screen reader users? How could we make the “hover” actually accessible? Or can they tab to the individual pie values somehow?
Yea! You could definitely handle it that way… tab would cycle through the coins and store them in active state. Give it a go!
Why parameter "d" in not working? My IDE says 'string | null' is not assignable to type 'string | undefined', no idea how to fix that
i heard this npm package while searching d3 visualizing in github
How do you add transition on the width ?
Theme and font??
Do you mind to demo a candlestick chart?
Hey Kai! I honestly haven't really had a use for a candlestick chart yet... I guess I don't do much financial/investment applications where you're tracking a low/high range over a period of time.
@@leighhalliday it’s okay, thanks for the content
How would you compare visa to D3?
I have actually never used straight up D3 so I am not really sure, but visx (along with most other libraries like this) uses D3 under the hood.
Hi Leigh, i have a issue with react, can you help my to understand where is my issue? Thank you for support ;)
Hey! I have a Discord (in description), feel free to join and ask the community for support.
A fellow ADA hodler? :p
Most def!
Great tutorial, but you should just get Bitcoin
Please never use pie charts
Sorry, I’ll try to stick to donut charts :)
@@leighhalliday perfect thanks