Published
Edited
Dec 9, 2018
7 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
margin = ({top: 20, right: 30, bottom: 10, left: 40})
Insert cell
formatDate = d3.timeFormat("%B %-d, %Y")
Insert cell
formatValue = d3.format(".2f")
Insert cell
formatChange = {
const f = d3.format("+.2%");
return (y0, y1) => f((y1 - y0) / y0);
}
Insert cell
parseDate = d3.timeParse("%Y-%m-%d")
Insert cell
data = {
const startValue = 115.0;
function naiveRandomWalk(value, maxStep = 3) {
if (Math.random() > 0.5) {
return value + Math.random() * maxStep;
}
return value - Math.random() * maxStep;
}
const dates = d3.timeDays(new Date("2017-01-01"), new Date("2017-12-31"));
let data = [];
dates.filter(date => date.getDay() != 0 && date.getDay() != 6).forEach((date, i) => {
if (i === 0) {
data.push({
date,
open: startValue,
high: generateHighPrice(startValue, startValue),
low: generateLowPrice(startValue, startValue),
close: naiveRandomWalk(startValue),
})
} else {
const open = naiveRandomWalk(data[i-1].close);
const close = naiveRandomWalk(open);
data.push({
date,
open,
high: generateHighPrice(open, open),
low: generateLowPrice(close, close),
close
})
}
})
return data;
}
Insert cell
function generateHighPrice(price, floor, maxVariation = 4.0) {
let attempt = price + (Math.random() * maxVariation);
while (attempt < floor) {
attempt = price + (Math.random() * maxVariation);
}
return attempt;
}
Insert cell
function generateLowPrice(price, ceiling, maxVariation = 4.0) {
let attempt = price - (Math.random() * maxVariation);
while (attempt > ceiling) {
attempt = price - (Math.random() * maxVariation);
}
return attempt;
}
Insert cell
dataFC = {
const {randomFinancial, randomSkipWeekends} = fc;
const generator = randomFinancial()
.startDate(new Date(2017, 0, 1))
.startPrice(115)
.filter(randomSkipWeekends)
.sigma(0.2);

return generator(261)
// .slice(0, 120);
}
Insert cell
Insert cell
moment = require('moment')
Insert cell
fc = require('d3fc')
Insert cell
d3 = require("d3@5")
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