search

observablehq / framework

A static site generator for data apps, dashboards, reports, and more. Observable Framework combines JavaScript on the front-end for interactive graphics with any language on the back-end for data analysis.
https://observablehq.com/framework/
ISC License
2.58k stars 125 forks source link

fix responsive chart dimensions on the EIA example #1655

Closed Fil closed 2 months ago

Fil commented 2 months ago

This was a transient warning, due to the fact that the charts run independently. The height of the interchange chart was negative when the map had not yet been inserted in the DOM. By setting a min-height in css, we avoid the warning and more importantly only compute the charts once.

warning

Thanks @mootari for reporting.

In addition, I fixed the display for small screens.

redeployed at https://observablehq.observablehq.cloud/framework-example-eia/

Fil commented 2 months ago

We could do more to make sure the page looks good on smaller screens too. For example in this view, we should remove the padding to give a bit more space to the map, make sure the legend doesn't overlap, etc. DONE