From c8f4ae933685933b4c09852a5ad34cca11095a25 Mon Sep 17 00:00:00 2001 From: John West Date: Wed, 31 Jan 2024 09:34:11 -0500 Subject: [PATCH] Update to 0.21 --- package.json | 2 +- src/app.html | 2 +- src/lib/components/viz.svelte | 7 ++- src/routes/+page.svelte | 84 ++++++++++++++++++++++++++--------- static/main.css | 4 ++ 5 files changed, 75 insertions(+), 24 deletions(-) diff --git a/package.json b/package.json index 3715d46..3fa75d6 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "midsommer", - "version": "0.0.20", + "version": "0.0.21", "scripts": { "dev": "vite dev", "build": "vite build && npm run package", diff --git a/src/app.html b/src/app.html index 19863a2..78e5e10 100644 --- a/src/app.html +++ b/src/app.html @@ -4,7 +4,7 @@ - + Midsommer %sveltekit.head% diff --git a/src/lib/components/viz.svelte b/src/lib/components/viz.svelte index 66e3cf0..63788c1 100644 --- a/src/lib/components/viz.svelte +++ b/src/lib/components/viz.svelte @@ -39,10 +39,13 @@ let ready = false; let state; let worker; -const x = scaleLinear() +let x; +let y; + +$: x = scaleLinear() .domain([0, (somConfig.width + 2) * space]) .range([xOffset, width + xOffset]); -const y = scaleLinear() +$: y = scaleLinear() .domain([0, (somConfig.height + 2) * space]) .range([yOffset, height + yOffset]); diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index ec7e840..8516637 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -28,20 +28,22 @@ for (const vote of csvParse(rawVotes)) { extant.votes.push({ cast_code: +vote.cast_code, rollnumber: +vote.rollnumber, - }) + }); } else { const senator = members.find((m) => +m.icpsr === +vote.icpsr); data.push({ bioname: senator.bioname, icpsr: +vote.icpsr, - party: +senator.party_code === 200 ? 'r' : 'd', - votes: [{ - cast_code: +vote.cast_code, - rollnumber: +vote.rollnumber, - }] - }) + party: +senator.party_code === 200 ? "r" : "d", + votes: [ + { + cast_code: +vote.cast_code, + rollnumber: +vote.rollnumber, + }, + ], + }); } - votes.push(+vote.rollnumber); + votes.push(+vote.rollnumber); } } votes = [...new Set(votes)].sort((a, b) => a - b); @@ -60,7 +62,10 @@ for (const datum of data) { const bgScale = scaleLinear() .domain([0, 1]) - .range(["rgba(255,100,100,0.5)", "rgba(100,100,255,0.5)"]); + .range(["rgba(255,100,100,0.2)", "rgba(100,100,255,0.2)"]); +const fgScale = scaleLinear() + .domain([0, 1]) + .range(["rgba(255,100,100,0.4)", "rgba(100,100,255,0.4)"]); const callback = (report) => { edges = report.edges; iteration = report.iteration; @@ -70,11 +75,11 @@ const callback = (report) => { const forceConfig = { centerStrength: 1, filterEmpties: false, - hideEmpties: false, - iterations: 2, - manyBodyStrength: -300, - spaceStrength: 0.03, -} + hideEmpties: true, + iterations: 5, + manyBodyStrength: -100, + spaceStrength: 0.005, +}; const somConfig = { dimensions: data[0].vector.length, height: 9, @@ -96,6 +101,7 @@ let height = 468; let learningRate = 0; let iteration = 0; let nodes = []; +let q = ""; let radius = 0; let ready = false; let state = null; @@ -114,12 +120,37 @@ $: bgs = nodes.map((n) => { ), }; }); -$: fill = (node) => { - if (node.data.length > 0) { - return `url(#node)`; +$: fgs = nodes.map((n) => { + const out = { + id: `node-fg-${n.id}`, + end: "transparent", + }; + if ( + !q || + n.data.filter((d) => d.bioname.toLowerCase().includes(q.toLowerCase())) + ) { + out.start = fgScale( + n.data.filter((n) => n.party === "d").length / n.data.length, + ); } else { - return 'black' + out.start = "transparent"; } + return out; +}); +$: fill = (node) => { + if ( + node.data.length > 0 && + ( + !q || + node.data.filter((d) => d.bioname.toLowerCase().includes(q.toLowerCase())) + ) + ) { + return `url(#node)`; + } + return "black"; +}; +$: foreground = (node) => { + return `url(#node-fg-${node.id})`; }; $: radius = (node) => { if (node.data.length === 0) { @@ -129,14 +160,14 @@ $: radius = (node) => { } else { return 3.5; } -} +};

Midsommer

-

How the Senate of the 117th congress voted.

+

Clustering senators in the 117th congress by their votes

@@ -152,6 +183,10 @@ $: radius = (node) => {
+
+

Search for a senator...

+ +
{#if active}
    {#each active.data as senator} @@ -194,6 +229,7 @@ $: radius = (node) => { data={data} fill={fill} forceConfig={forceConfig} + foreground={foreground} height={height} radius={radius} somConfig={somConfig} @@ -204,6 +240,14 @@ $: radius = (node) => {