From 86d76803a0c15a585056a3041ee98d52578dfc45 Mon Sep 17 00:00:00 2001 From: Colin Date: Thu, 28 Oct 2021 12:25:19 -0400 Subject: [PATCH 1/4] Misc --- .../QuantitativeSequenceRenderer.ts | 34 ++++++++++++++++--- yarn.lock | 2 +- 2 files changed, 31 insertions(+), 5 deletions(-) diff --git a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts index 813c948..b562cb7 100644 --- a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts +++ b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts @@ -44,16 +44,42 @@ export default function rendererFactory(pluginManager: PluginManager) { console.log({ features }) ctx.textAlign = 'center' + ctx.font = '10px sans-serif' for (const feature of features.values()) { const [leftPx, rightPx] = featureSpanPx(feature, region, bpPerPx) const w = rightPx - leftPx + 0.4 // fudge factor for subpixel rendering const score = feature.get('score') as number const base = feature.get('base') ctx.fillStyle = getColor(base) - ctx.fillRect(leftPx, toY(score), w, toHeight(score)) - ctx.fillStyle = '#000' - if (1 / bpPerPx > 5) { - ctx.fillText(base, leftPx + (rightPx - leftPx) / 2, toY(score) - 2) + if (1 / bpPerPx < 5) { + ctx.fillRect(leftPx, toY(score), w, toHeight(score)) + } else { + console.log({ + height: toHeight(score), + y: toY(score), + }) + ctx.setTransform( + w / 10, + 0, + 0, + toHeight(score) / 10, + leftPx * 2 + (rightPx - leftPx), + height + (toY(score) - toHeight(score)), // 1, //toY(score), + ) + // ctx.setTransform( + // 1, + // 0, + // 0, + // 1, // toHeight(score) / 10, + // leftPx, // + (rightPx - leftPx) / 2, + // toY(score) - 2, + // ) + ctx.fillText( + base, + 0, // + (rightPx - leftPx) / 2, + 20, + //toY(score) - 2, + ) } } diff --git a/yarn.lock b/yarn.lock index 9b34d0b..3aba93b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1292,7 +1292,7 @@ resolved "https://registry.yarnpkg.com/@librpc/ee/-/ee-1.0.4.tgz#ce73a36279dc4cf93efa43f7e3564ec165947522" integrity sha512-vhPlbRwAKQC80h0k74tsOkMKIidZtqlFSOHRzCvC8n7Va9rzMDwpG26Pm84dAt0ZuGK0g1UEfPzxDiYo9ZQBrg== -"@librpc/web@github:rbuels/librpc-web#737bb9706762a52a87169a12c9b59fb241febab0": +"@librpc/web@rbuels/librpc-web#737bb9706762a52a87169a12c9b59fb241febab0": version "1.1.0" resolved "https://codeload.github.com/rbuels/librpc-web/tar.gz/737bb9706762a52a87169a12c9b59fb241febab0" dependencies: From 279d8eb0a83a6c9f6efc6423af7e9eef0f5d2c76 Mon Sep 17 00:00:00 2001 From: Colin Date: Thu, 28 Oct 2021 12:27:14 -0400 Subject: [PATCH 2/4] Intermediate --- .../QuantitativeSequenceRenderer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts index b562cb7..f7de78a 100644 --- a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts +++ b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts @@ -64,7 +64,7 @@ export default function rendererFactory(pluginManager: PluginManager) { 0, toHeight(score) / 10, leftPx * 2 + (rightPx - leftPx), - height + (toY(score) - toHeight(score)), // 1, //toY(score), + height + (toY(score) - toHeight(score)) - toY(20), // 1, //toY(score), ) // ctx.setTransform( // 1, From 73786dab11d745a5fcd0def2cf469c917e9d99b1 Mon Sep 17 00:00:00 2001 From: Colin Date: Thu, 28 Oct 2021 12:47:32 -0400 Subject: [PATCH 3/4] Magic numbers --- .../QuantitativeSequenceRenderer.ts | 26 +++---------------- 1 file changed, 4 insertions(+), 22 deletions(-) diff --git a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts index f7de78a..487d649 100644 --- a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts +++ b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts @@ -34,7 +34,6 @@ export default function rendererFactory(pluginManager: PluginManager) { const scale = getScale(opts) if (region.end - region.start > 5000) { - console.log('using super') super.draw(ctx, props) return } @@ -42,7 +41,6 @@ export default function rendererFactory(pluginManager: PluginManager) { const toY = (n: number) => height - scale(n) + YSCALEBAR_LABEL_OFFSET const toHeight = (n: number) => toY(originY) - toY(n) - console.log({ features }) ctx.textAlign = 'center' ctx.font = '10px sans-serif' for (const feature of features.values()) { @@ -54,32 +52,16 @@ export default function rendererFactory(pluginManager: PluginManager) { if (1 / bpPerPx < 5) { ctx.fillRect(leftPx, toY(score), w, toHeight(score)) } else { - console.log({ - height: toHeight(score), - y: toY(score), - }) ctx.setTransform( w / 10, 0, 0, - toHeight(score) / 10, + toHeight(score) / 4, leftPx * 2 + (rightPx - leftPx), - height + (toY(score) - toHeight(score)) - toY(20), // 1, //toY(score), - ) - // ctx.setTransform( - // 1, - // 0, - // 0, - // 1, // toHeight(score) / 10, - // leftPx, // + (rightPx - leftPx) / 2, - // toY(score) - 2, - // ) - ctx.fillText( - base, - 0, // + (rightPx - leftPx) / 2, - 20, - //toY(score) - 2, + height + toY(0) / 2 + YSCALEBAR_LABEL_OFFSET, ) + + ctx.fillText(base, 0, 0) } } From 20520a2fe7c8bcd26f756a897e4e6ab2a7ef4090 Mon Sep 17 00:00:00 2001 From: Colin Date: Thu, 28 Oct 2021 12:49:20 -0400 Subject: [PATCH 4/4] Make bold --- .../QuantitativeSequenceRenderer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts index 487d649..3208071 100644 --- a/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts +++ b/src/QuantitativeSequenceRenderer/QuantitativeSequenceRenderer.ts @@ -42,7 +42,7 @@ export default function rendererFactory(pluginManager: PluginManager) { const toHeight = (n: number) => toY(originY) - toY(n) ctx.textAlign = 'center' - ctx.font = '10px sans-serif' + ctx.font = 'bold 10px sans-serif' for (const feature of features.values()) { const [leftPx, rightPx] = featureSpanPx(feature, region, bpPerPx) const w = rightPx - leftPx + 0.4 // fudge factor for subpixel rendering