diff --git a/scripts/figures.js b/scripts/figures.js index 8a24ebd..bf82da1 100644 --- a/scripts/figures.js +++ b/scripts/figures.js @@ -750,18 +750,18 @@ function generate_pca_transform() { .domain(linspace(xaxis.bounds[0] - xaxis.padding, xaxis.bounds[1] + xaxis.padding, COLORMAP.length)) let INSET_SIZE = 350 - let padding = 10 + let padding = 20 let hscale = 0.4 let vscale = 0.25 let lscale = 0.25 let offset = (width - ((1 + vscale) * INSET_SIZE) - padding) / 2 let INSETS = G.append("g").attr("transform", `translate(${offset},0)`) let XY = INSETS.append("g").attr("transform", `translate(${vscale * INSET_SIZE + padding},0)`) - createInset(XY, INSET_SIZE, hscale * INSET_SIZE, "X", "Y") + createInset(XY, INSET_SIZE, hscale * INSET_SIZE, "X", "Y", false) let XZ = INSETS.append("g").attr("transform", `translate(${vscale * INSET_SIZE + padding},${hscale * INSET_SIZE + padding})`) - createInset(XZ, INSET_SIZE, lscale * INSET_SIZE, "X", "Z") + createInset(XZ, INSET_SIZE, lscale * INSET_SIZE, "X", "Z", true) let YZ = INSETS.append("g").attr("transform", `translate(0,0)`) - createInset(YZ, vscale * INSET_SIZE, hscale * INSET_SIZE, "Y", "Z") + createInset(YZ, vscale * INSET_SIZE, hscale * INSET_SIZE, "Z", "Y", false) Promise.all([ d3.csv("data/actin_compression_pca_results.csv"), @@ -872,7 +872,7 @@ function generate_pca_transform() { .attr("d", function(d) { let makePath = d3.line() .x(m => xscale_inset(m)) - .y((m,i) => yscale_inset(d.z[i])) + .y((m,i) => yscale_inset(-d.z[i])) return makePath(d.x) }) .attr("fill", d => "none") diff --git a/scripts/utilities.js b/scripts/utilities.js index 4edd1e4..b1036c6 100644 --- a/scripts/utilities.js +++ b/scripts/utilities.js @@ -131,30 +131,50 @@ function makeLabel(simulator, velocity, repeat) { } } -function createInset(g, width, height, a, b) { +function createInset(g, width, height, a, b, invert) { g.append("rect") - .attr("width", width) - .attr("height", height) - .attr("fill", "none") - .attr('stroke', '#555') - .attr("stroke-dasharray", "1,2") - .attr("stroke-width", 0.5) - g.append("path") - .attr("d", `m 0,${height} l 0,-15 m 0,15 l 15,0`) - .attr("fill", "none") - .attr('stroke', '#fff') - g.append("text") - .attr("x", 0) - .attr("y", height - 20) - .attr("fill", "#fff") - .attr("text-anchor", "middle") - .text(b) - g.append("text") - .attr("x", 21) - .attr("y", height + 4) - .attr("fill", "#fff") - .attr("text-anchor", "middle") - .text(a) + .attr("width", width) + .attr("height", height) + .attr("fill", "none") + .attr('stroke', '#555') + .attr("stroke-dasharray", "1,2") + .attr("stroke-width", 0.5) + + if (invert) { + g.append("path") + .attr("d", `m 0,0 l 0,15 m 0,-15 l 15,0`) + .attr("fill", "none") + .attr('stroke', '#fff') + g.append("text") + .attr("x", 0) + .attr("y", 28) + .attr("fill", "#fff") + .attr("text-anchor", "middle") + .text(b) + g.append("text") + .attr("x", 21) + .attr("y", 4) + .attr("fill", "#fff") + .attr("text-anchor", "middle") + .text(a) + } else { + g.append("path") + .attr("d", `m 0,${height} l 0,-15 m 0,15 l 15,0`) + .attr("fill", "none") + .attr('stroke', '#fff') + g.append("text") + .attr("x", 0) + .attr("y", height - 20) + .attr("fill", "#fff") + .attr("text-anchor", "middle") + .text(b) + g.append("text") + .attr("x", 21) + .attr("y", height + 4) + .attr("fill", "#fff") + .attr("text-anchor", "middle") + .text(a) + } } function individualVizLink(simulator, velocity, replicate) { @@ -176,4 +196,4 @@ function formatVelocity(velocity) { v = "0" + v } return v -} \ No newline at end of file +}