Published
Edited
Mar 31, 2018
1 star
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
d3 = require("https://unpkg.com/d3@4.13.0/build/d3.min.js")
Insert cell
Insert cell
eventDrops = require("https://unpkg.com/event-drops/dist/index.js")
Insert cell
Insert cell
stylesheet = html`<link href='https://unpkg.com/event-drops/dist/style.css' rel='stylesheet' />`
Insert cell
Insert cell
{
const repositoriesData = [{
name: "intake",
data: [
{ date: new Date('03/02/2018 6:55:11 PM') },
{ date: new Date('03/02/2018 10:56:11 PM') },
{ date: new Date('03/03/2018 6:57:11 AM') },
]
}, {
name: "eligibility",
data: [
{ date: new Date('03/03/2018 6:58:09 PM') },
{ date: new Date('03/03/2018 11:58:09 PM') }, ]
}, {
name: "assessment",
data: [
{ date: new Date('03/04/2018 6:59:09 PM') }
]
}, {
name: "dispute resolution",
data: [
{ date: new Date('03/05/2018 7:01:09 AM') }
]
}, {
name: "compliance",
data: [
{ date: new Date('03/05/2018 7:05:09 PM') }
]
}, {
name: "closure",
data: [
{ date: new Date('03/05/2018 11:12:07 PM') }
]
}];

var chart = eventDrops({
range: {
start: new Date('03/01/2018 6:55:11 PM'),
end: new Date('03/06/2018 7:15:11 PM')
},
drop: {
date: d => d.date,
},
});

d3.select(events).data([repositoriesData]).call(chart);
}
Insert cell
Insert cell
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