The avatar for @cmudig
CMU Data Interaction Group
We are a research group at the CMU HCII. Our mission is to empower people to analyze and communicate data with interactive systems.
Public
Line Density
Edited
Oct 23, 2023
Fork of Line With Bias Generation for First Experiment
Importers
Line Density
Averages estimated from irregularly sampled dataLine With Bias Generation for First Experiment
Line Bias Data Generation for Second Experiment
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
stimuli = (deBias ? debiasMeans : scaleData)(
configs.map((d, i) => {
const ys = dataGenerator(...d.noise, d.seed, d.flip, n, deBias);
const highNoiseYs = dataGenerator(
lowNoise,
highNoise,
d.seed,
d.flip,
n,
deBias
);

const data = xSequence.map((x) => ({ x, y: ys[x] }));
const highNoiseData = xSequence.map((x) => ({ x, y: highNoiseYs[x] }));

return {
index: d.index,
seed: d.seed,
noise: d.noise,
flip: d.flip,
type: d.type,
data:
d.type === "point_arc"
? pointsAlongArc(
// scale data so we can compute points along arc
data.map(({ x, y }) => ({ x: xScale(x), y: yScale(y) }))
)
: data,
lineData: data,
highNoiseData
};
}),
1
)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
configs = {
const configs = [];
let index = 0;
seeds.forEach((seed) =>
["line", "point", "point_arc"].forEach((type) =>
[lowNoise, highNoise].forEach((noise) =>
[false, true].forEach((flip) =>
configs.push({
index: index++,
type,
noise: [lowNoise, noise],
seed,
flip
})
)
)
)
);
return configs;
}
Insert cell
Insert cell
deBias = fix === "de-bias means"
Insert cell
xSequence = d3.range(0, n, sample)
Insert cell
views = stimuli.map((s) => makeView(s, { w, h, showLine, showMiddle }))
Insert cell
xScale = d3.scaleLinear().domain([0, n]).range([0, w])
Insert cell
yScale = d3.scaleLinear().domain([0, 1]).range([0, h])
Insert cell
epsylon = 1e-9
Insert cell
function pointsAlongArc(anchors) {
const spacing = (arcLength(anchors) / n) * sample - epsylon;

let remaining = spacing;
let current = 0;
const out = [];

let currentAnchor = anchors[0];

let maxIters = 1000;

while (current < anchors.length - 1) {
const nextAnchor = anchors[current + 1];
const dx = nextAnchor.x - currentAnchor.x;
const dy = nextAnchor.y - currentAnchor.y;

const dist = Math.sqrt(dx * dx + dy * dy);

// console.log(current, dist, remaining);

if (dist > remaining) {
const frac = remaining / dist;
const x = currentAnchor.x + frac * dx;
const y = currentAnchor.y + frac * dy;
out.push({ x: xScale.invert(x), y: yScale.invert(y) });

currentAnchor = { x, y };
remaining = spacing;
} else {
remaining = remaining - dist;
current++;
currentAnchor = anchors[current];
}

if (!maxIters--) {
console.log("Finished early!");
break;
}
}

return out;
}
Insert cell
function arcLength(anchors) {
let length = 0;

for (let i = 0; i < anchors.length - 1; i++) {
const currentAnchor = anchors[i];
const nextAnchor = anchors[i + 1];

const dx = nextAnchor.x - currentAnchor.x;
const dy = nextAnchor.y - currentAnchor.y;

length += Math.sqrt(dx * dx + dy * dy);
}

return length;
}
Insert cell
Insert cell
import {
movingAverage,
dataGenerator,
debiasMeans,
scaleData,
makeView,
seeds
} from "@domoritz/bias-experiment-1"
Insert cell
Insert cell

One platform to build and deploy the best data apps

Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.
Learn more