// viewof cutoff = Inputs.range([50, 500], {step: 1, label: "Top n pairs :", value: 100})
viewof valuecutoff = Inputs.range([0, 500], {step: 1, label: "Appear at least n times", value: 100})
fromwhere = md`
<div style="overflow-x:auto;">
<h6 style="font-size: 3vw;font-family:'Kumbh Sans'">From: ${source}</h4>
`
data = (ts_or_not === "True")? allLevelTS.filter(
d => d.year == currYear && d['source name'] == source && d.level == level && d.value >= valuecutoff) :
allLevelAggregated.filter(d => d['source name'] == source && d.level == level && d.value >= valuecutoff)
// d => d.year == currYear && d['source name'] == source && d.level == level && d.rank <= cutoff)
allLevelTS = FileAttachment("sankey_ts_df.csv").csv()
allLevelAggregated = FileAttachment("sankey_aggregated_df.csv").csv()
ts = FileAttachment("sankey_diagram_time_series.csv").csv()
fulldata = FileAttachment("sankey_diagram_ref_vis_level1@2.json").json()
energy = (ts_or_not === "True")? ts.filter( d => d.year == currYear) : fulldata['links']
// _.range(1990, 2022, 1)
// energy = FileAttachment("energy.csv").csv({typed: true})
d3Sankey = require.alias({"d3-array": d3, "d3-shape": d3, "d3-sankey": "d3-sankey@0.12.3/dist/d3-sankey.min.js"})("d3-sankey")
import {select, radio, slider, checkbox} from "@jashkenas/inputs"
import {swatches} from "@d3/color-legend"
import { rangeSlider as rangeSlider } from '@mootari/range-slider'
import {Scrubber} from "@mbostock/scrubber"
import {howto} from "@d3/example-components"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
