data500 = FileAttachment("e_synth-vowels_formant_estimation_vowlim500.csv").csv()
formants = {
let d = data500
// d = d.filter(d=>d[z_label] == "ah" || d[z_label] == "uh" || d[z_label] == "ih")
d = d.filter(d=> selected_vowels.includes(d[z_label]))
d = d.filter(d=> selected_gender.includes(d["sex"]))
return d
}
transforms = [["Overview", "#333", d3.zoomIdentity]].concat(d3.groups(formants, d => d[z_label]).map(([key, data]) => {
const [x0, x1] = d3.extent(data, d => parseFloat(d[x_label])).map(x);
const [y1, y0] = d3.extent(data, d => parseFloat(d[y_label])).map(y);
const k = 0.9 * Math.min(width / (x1 - x0), height / (y1 - y0));
const tx = (width - k * (x0 + x1)) / 2;
const ty = (height - k * (y0 + y1)) / 2;
return [`${key}`, z(key), d3.zoomIdentity.translate(tx, ty).scale(k)];
}))
x_extent = d3.extent(formants, d => parseFloat(d[x_label]))
y_extent = d3.extent(formants, d => parseFloat(d[y_label]))
b = 500
x = {
let [min, max] = x_extent;
const scale = d3.scaleLinear()
.domain([min - b, max + b])
.range([0, width])
return scale
}
x(0)
y = {
let [min, max] = y_extent;
const scale = d3.scaleLinear()
.domain([min - b, max + b])
.range([height, 0])
return scale
}
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.
