Public
Edited
Mar 28, 2023
4 forks
screenShot20230227At13637Pm = FileAttachment("Screen Shot 2023-02-27 at 1.36.37 PM.jpg").image()
md`### Precedent:
http://shirleywu.studio/legends/`
md`### 3D Prototype:
https://observablehq.com/d/4b2976505a029433`
screenShot20230309At91424Pm = FileAttachment("Screen Shot 2023-03-09 at 9.14.24 PM.png").image()
md`### 2D Prototype:
https://observablehq.com/d/b79670f287418b75`
screenShot20230328At124745Pm = FileAttachment("Screen Shot 2023-03-28 at 12.47.45 PM.png").image()
screenShot20230328At124755Pm = FileAttachment("Screen Shot 2023-03-28 at 12.47.55 PM.png").image()
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
d3 = require("d3@5")
_ = require('lodash')
screenShot20230321At122221Pm = FileAttachment("Screen Shot 2023-03-21 at 12.22.21 PM.png").image()
md`### Precedent:
https://www.behance.net/gallery/162088471/Bloomberg-Coal-Countdown-Video-Campaign?tracking_source=search_projects%7Cdata+visualization`
md`### 2D Small Multiples Prototype:
https://observablehq.com/d/4860c316ccc55f46`
screenShot20230320At110439Am = FileAttachment("Screen Shot 2023-03-20 at 11.04.39 AM.png").image()
screenShot20230328At125639Pm = FileAttachment("Screen Shot 2023-03-28 at 12.56.39 PM.png").image()
data = [
{
"Year": 2023,
"radA": 100,
"radB": 22,
"radC": 11
},
{
"Year": 2022,
"radA": 100,
"radB": 15,
"radC": 8
},
{
"Year": 2021,
"radA": 100,
"radB": 27,
"radC": 9
},
{
"Year": 2020,
"radA": 100,
"radB": 14,
"radC": 8
},
{
"Year": 2019,
"radA": 100,
"radB": 35,
"radC": 9
},
{
"Year": 2018,
"radA": 100,
"radB": 30,
"radC": 8
},
{
"Year": 2017,
"radA": 100,
"radB": 20,
"radC": 8
},
{
"Year": 2016,
"radA": 100,
"radB": 18,
"radC": 6
},
{
"Year": 2015,
"radA": 100,
"radB": 18,
"radC": 6
},
{
"Year": 2014,
"radA": 100,
"radB": 18,
"radC": 6
},
{
"Year": 2013,
"radA": 100,
"radB": 22,
"radC": 6
},
{
"Year": 2012,
"radA": 100,
"radB": 21,
"radC": 6
},
{
"Year": 2011,
"radA": 100,
"radB": 12,
"radC": 4
},
{
"Year": 2010,
"radA": 100,
"radB": 15,
"radC": 5
},
{
"Year": 2009,
"radA": 100,
"radB": 13,
"radC": 5
},
{
"Year": 2008,
"radA": 100,
"radB": 10,
"radC": 4
},
{
"Year": 2007,
"radA": 100,
"radB": 12,
"radC": 3
},
{
"Year": 2006,
"radA": 100,
"radB": 15,
"radC": 4
},
{
"Year": 2005,
"radA": 100,
"radB": 11,
"radC": 3
},
{
"Year": 2004,
"radA": 100,
"radB": 13,
"radC": 3
},
{
"Year": 2003,
"radA": 100,
"radB": 12,
"radC": 2
},
{
"Year": 2002,
"radA": 100,
"radB": 9,
"radC": 3
},
{
"Year": 2001,
"radA": 100,
"radB": 10,
"radC": 3
},
{
"Year": 2000,
"radA": 100,
"radB": 9,
"radC": 2
},
{
"Year": 1999,
"radA": 100,
"radB": 8,
"radC": 2
},
{
"Year": 1998,
"radA": 100,
"radB": 8,
"radC": 2
},
{
"Year": 1997,
"radA": 100,
"radB": 8,
"radC": 2
},
{
"Year": 1996,
"radA": 100,
"radB": 6,
"radC": 2
},
{
"Year": 1995,
"radA": 100,
"radB": 6,
"radC": 1
},
{
"Year": 1994,
"radA": 100,
"radB": 4,
"radC": 1
}
]
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.
