Using React (Hooks) with D3 – [09] Racing Bar Chart

Показать описание

Hi, this is part 9 of the series "Using React (Hooks) with D3", and in this one, we create a Racing Bar Chart.

Code:

Twitter:

Рекомендации по теме

Комментарии

Such a good tutorial, thank you! A cool trick I've learnt is that if you add *.attr('dy', '0.32em')* to text it always perfectly centralises the text vertically once you've set the y attribute to be the yScale plus half the bandwidth - no matter the font size. Then you don't have to notch the text down till it looks right, it gets done for you.

HyprSniprUK

thanks so much for this series man, you are the king!

lorenzoleuck

Great work on this. I am still pulling my hair out with D3. I am working on a realtime updating bar chart with React Hooks. Every time the new data is passed to the chart it just adds new groups and doesn't clean up the old ones!

YabbaDadADo

Hi Maury, another great tutorial, thanks. I'm actually coming from a D3 background but new to React and still finding them really useful.

louleg

I appreciate your work. Thank you so much.

multi_variate

OMG, this is holy grail tutorial! thank you soooo much!

namucho

i appreciate your work. thank you so much.

BSRankings

Hello Sir please make video on react d3 gauge with needle which show value.

nileshsingh

please create grouped bar plot video using d3 and hook

MDSALMAN-njjd

how to build vertical bar in this code

harshalattarde

Sir why didn't you explain useinterval ?? And many things are not explained in the video
Sir I am new to this d3 liabrary that's why I am getting some problems can you give me some reference from where should I study the basics ?

musheerahmad

Hi Sir, can you please make a video using angular 8 to create a racing bar chart?

sachinramteke

Using React (Hooks) with D3 – [09] Racing Bar Chart

Using React (Hooks) with D3 – [01] The Basics

Using React (Hooks) with D3 – [Finale] 5 Things You Should Know

Using React (Hooks) with D3 – [05] Interactivity

Using React (Hooks) with D3 – [03] Axes and Scales

Using React (Hooks) with D3 – [13] Filtering Visually (with Brushes, Part I)

Using React (Hooks) with D3 – [11] Physics-based Force Layout

Using React (Hooks) with D3 – [Bonus] D3 v5 → v6 (New Event Handling)

Using React (Hooks) with D3 – [14] Filtering Visually (with Brushes, Part II)

Using React (Hooks) with D3 – [01] The Basics (Remastered)

Using React (Hooks) with D3 – [08] Breaking Bad Timeline

Hooked on D3: Create Animated Ch(art)s with D3 and React Hooks - Monica Wojciechowska

Using React (Hooks) with D3 – [09] Racing Bar Chart

D3 and React.js crash course using react hooks | Build a responsive line chart with d3.js

Using React (Hooks) with D3 – [06] Responsive Chart Components with ResizeObserver

Using React (Hooks) with D3 – [16] Zoomable Line Chart

Using React (Hooks) with D3 – [04] Animated Bar Chart

Using React (Hooks) with D3 – [15+] Stacked Area Chart

Simple D3 Line Chart in React | Hooks

React Hooks for Dataviz

Using React (Hooks) with D3 – [12] World Map with D3-geo

Using React (Hooks) with D3 – [15] Stacked Bar Chart

Nordic.js 2019 • Monica Wojciechowska - Hooked on D3: Creating Animated Ch(art)s with D3 and React

Loading CSV Data with React Hooks and D3

Using React (Hooks) with D3 – [10] Animated Tree Chart