Public
Edited
Jan 10, 2024
2 forks
9 stars
Insert cell
Insert cell
chart = {
const figure = html`<div style="height: 500px;">`;
Highcharts.chart(figure, {
chart: {
type: "dumbbell",
inverted: true
},
legend: {
enabled: false
},
subtitle: {
text: "1960 vs 2018"
},
title: {
text: "Change in Life Expectancy"
},
tooltip: {
shared: true
},
xAxis: {
type: "category"
},
yAxis: {
title: {
text: "Life Expectancy (years)"
}
},
series: [{
name: "Life expectancy change",
data
}]
});
return figure;
}
Insert cell
data = FileAttachment("countries.csv").csv({typed: true})
Insert cell
Highcharts = {
const Highcharts = await require("highcharts@8");
const r = require.alias({highcharts: Highcharts});
await r("highcharts@8/highcharts-more.js");
await r("highcharts@8/modules/dumbbell.js");
return Highcharts;
}
Insert cell

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.
Learn more