How to link multiple plots


I wanted to visualise a dataset which has a geo component as well as a time component. So I thought the easiest way to get started is to visualise the geo data at a specific time plus a time series graph with a “time cursor” to select the time for the map view.

After trying various higher-level libraries I ended up with plain D3 which includes lots of boiler-plate code.

But the primary thing I struggled with was connecting the two visualisations together. Ultimately I ended up with writing a naive consumer/producer queue based on generators.

My question. Is there a cleaner way of doing this?
And how would I have achieved the same with libraries like Plot or VegaLite

The notebook in questions: Experimenting with visualising FFDI / Max Ott / Observable

This could be a good question for the Analyzing Time Series Data in Observable: Hands-on Workshop this week @enjalot

I would create a synthetic view authority with

 viewof primary = Inputs.input({...state...})

Then derive n plots off it, and either connect them with dataflow, or Inputs.bind

If you need some extra code for custom interactions, then update the authority with

 viewof primary.value = <new>

and broadcast the change with a dataflow event with

viewof primary.dispatchEvent(new Event('input', {bubbles:true})


Thanks for the comprehensive reply, but I don’t seem to be be able to recreate it. primary = viewof ... gives me an viewof Inputs is not defined. Seems like viewof can’t be assigned.

Anyway, viewof adds too much magic for my little bird brain :slight_smile: and I better stick with stdlib Generators.

In any case, thanks for taking the time to reply. Very much appreciated.

Sorry I typed that from phone, I put the viewof in the right place now. Yeah viewof has a steep learning curve but it is very useful for these situations.