Public
Edited
Nov 3, 2023
Insert cell
Insert cell
typing-analytics(2).json
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
dataParsed = data.map(item => {
return {...item, date: new Date(item.finishTime * 1000) }
})
Insert cell
Insert cell
Plot.plot({
inset: 8,
width: 1000,
margin: 40,
grid: true,
color: {
legend: true,
},
marks: [
Plot.dot(dataParsed, {x: "date", y: "wpm", stroke: "green"}),
Plot.linearRegressionY(dataParsed, {x: "date", y: "wpm", stroke: "red"})

]
})
Insert cell
typingAnalytics2 = FileAttachment("typing-analytics(2).json").json()
Insert cell
Insert cell
Plot.plot({
inset: 8,
width: 1000,
margin: 40,
grid: true,
color: {
legend: true,
},
marks: [
Plot.dot(dataParsed, {x: "date", y: "error", stroke: "green"}),
Plot.linearRegressionY(dataParsed, {x: "date", y: "error", stroke: "red"})

]
})
Insert cell
Insert cell
data_unproductive = dataParsed.map(item => {
return {date: item.date, percents: 100 * item.unproductiveKeystrokes / item.charCount }
})
Insert cell
Plot.plot({
inset: 8,
width: 1000,
margin: 40,
grid: true,
color: {
legend: true,
},
marks: [
Plot.dot(data_unproductive, {x: "date", y: "percents", stroke: "green"}),
Plot.linearRegressionY(data_unproductive, {x: "date", y: "percents", stroke: "red"})
]
})
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