diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 146771e..651eb64 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -88,7 +88,7 @@
diff --git a/src/routes/Brush.svelte b/src/routes/Brush.svelte index 631951c..d8cd556 100644 --- a/src/routes/Brush.svelte +++ b/src/routes/Brush.svelte @@ -9,7 +9,7 @@ let marginTop = 20; let marginRight = 20; let marginBottom = 20; - let marginLeft = 20; + let marginLeft = 28; let chunkWidth = 18; export let DATA_MIN = 1; export let DATA_MAX = 827; @@ -67,13 +67,10 @@ }; }); - $: y = d3 - .scaleBand( - data.map((d) => d.label), - [height - marginTop, marginBottom] - ) - .paddingOuter(0.05) - .round(true); + $: y = d3.scaleBand( + data.map((d) => d.label), + [height - marginTop, marginBottom] + ); $: xChunk = d3.scaleLinear([0, numChunks], [marginLeft, width - marginRight]); $: x = d3.scaleLinear([DATA_MIN, DATA_MAX], [marginLeft, width - marginRight]); $: d3.select(gy).call(d3.axisLeft(y)); @@ -87,7 +84,7 @@ ]) .on('brush', (/** @type {{ selection: [number, number]; }} */ e) => { const selection = e.selection; - if (selection[1] - selection[0] < 150) { + if (selection[1] - selection[0] <= 180) { const start = Math.round(x.invert(selection[0])); const end = Math.round(x.invert(selection[1])); @@ -96,7 +93,7 @@ }) .on('end', (/** @type {{ selection: [number, number]; }} */ e) => { const selection = e.selection; - if (selection[1] - selection[0] > 150) { + if (selection[1] - selection[0] > 180) { const start = Math.round(x.invert(selection[0])); const end = Math.round(x.invert(selection[1])); diff --git a/src/routes/Devilstable.svelte b/src/routes/Devilstable.svelte index cb735f1..a3626a9 100644 --- a/src/routes/Devilstable.svelte +++ b/src/routes/Devilstable.svelte @@ -92,10 +92,10 @@ } - (selection = e.detail)} /> + (selection = e.detail)} /> { return { label: d.label, values: d.values.slice(selection.start - 1, selection.end + 1) }; })}