Curious human. Interested in the mechanics of how things work.
Inputs.table(realistic)
testLegend = Plot.plot({
width: width/2.4,
marginLeft: 120,
marginRight: 50,
height: 120,
y: {
grid: false,
tick: false,
},
marks: [
Plot.text(distances, {x: 'distance', dx: 20, y: 'mode', text: 'distance', }),
Plot.link(distances,
{x1: 0, x2: "distance", y: "mode", strokeWidth: 2, stroke: d => legendScale(d['mode']), markerEnd: "arrow"}, ),
Plot.dot(distances, {x: 0, y: 'mode', fill: d => legendScale(d['mode']), r:5, stroke: 'white', }),
]
})
legendScale = d3.scaleOrdinal().range(['#BCE784', '#5DD39E', '#348AA7', '#2E2E2E']).domain(['Trains', 'Electric aircraft', 'Hydrogen aircraft', 'Petroleum aircraft'])
colorScale = d3.scaleOrdinal( replace[basePie], colorScales[basePie])
categories = ({
"Electric": ["e_count", "ne_count"],
"Trains": ["hsr_count", "nhsr_count"],
"High H2": ["highh2_count", "nhighh2_count"],
"Low H2": ["lowh2_count", "nlowh2_count"],
"Breakdown of sustainability index": ['train_potential',
'electric_potential', 'highh2_potential', 'no_potential'],
})
sectorColor = {
return d3.scaleOrdinal().domain(categories[basePie]).range(colorScales[basePie]);
}
realistic=nodes.filter(row=> row['net_scale_change']>0 && row['net_scale_change']<=5);
import {legend, swatches} from "@d3/color-legend"
distances = [
{mode: 'Electric aircraft', distance: 804},
{mode: 'Trains', distance: 750},
{mode: 'Hydrogen aircraft', distance: 3400},
{mode: 'Petroleum aircraft', distance: 14300},
]
nodes[0]
import {Swatches} from "@d3/color-legend"
import {activeColorScheme} from "b3a0a78984d6df2e"
import {worldMap, mapPath, mapProjection} from "b3a0a78984d6df2e"
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.
