I have following component structure in simple react app
<div id='app'>
<Navbar />
<Graph />
<Footer />
</div>
Navbar has fixed height 80px
Footer has fixed height 40px
Graph is a d3-wrapper div that contains SVG with graph elements.
How to fit Graph into the remaining height of the screen so it always occupies the remaining height the screen?
How to update react component containing d3-wrapper/SVG on resize event?
PS. As I want the graph to be responsive I should not hardcode width and height of the SVG.
Here is codepen snippet where I tried to solve this issue.