From 1677982ac5632604d9af8be5fb5692a89b734e27 Mon Sep 17 00:00:00 2001 From: Yohann Nedelec Date: Mon, 16 Mar 2026 10:47:14 +0100 Subject: [PATCH] adds lineWidth property; adds example --- examples/wig-lines.html | 66 +++++++++++++++++++++++++++++++++++++++++ js/feature/wigTrack.js | 11 ++++--- 2 files changed, 73 insertions(+), 4 deletions(-) create mode 100644 examples/wig-lines.html diff --git a/examples/wig-lines.html b/examples/wig-lines.html new file mode 100644 index 000000000..419deef67 --- /dev/null +++ b/examples/wig-lines.html @@ -0,0 +1,66 @@ + + + + + igv.js + + + + +

BigWig as lines

+ +

+ Two BigWig tracks together, displayed as lines of different width +

+ + +
+ + + + + + diff --git a/js/feature/wigTrack.js b/js/feature/wigTrack.js index a84930402..7987daae2 100755 --- a/js/feature/wigTrack.js +++ b/js/feature/wigTrack.js @@ -20,6 +20,7 @@ class WigTrack extends TrackBase { logScale: false, windowFunction: 'mean', graphType: 'bar', + lineWidth: 2, normalize: undefined, scaleFactor: undefined, overflowColor: `rgb(255, 32, 255)`, @@ -71,6 +72,8 @@ class WigTrack extends TrackBase { if ("heatmap" === config.graphType && !config.height) { this.height = 20 } + + this.lineWidth = config.lineWidth || WigTrack.defaults.lineWidth // Set lineWidth from config } async postInit() { @@ -292,11 +295,11 @@ class WigTrack extends TrackBase { const color = options.alpha ? IGVColor.addAlpha(this.getColorForFeature(f), options.alpha) : this.getColorForFeature(f) if (this.graphType === "line") { + const lineWidth = this.lineWidth + const properties = {"fillStyle": color, "strokeStyle": color, "lineWidth": lineWidth}; + if (lastY !== undefined) { - IGVGraphics.strokeLine(ctx, lastPixelEnd, lastY, x, y, { - "fillStyle": color, - "strokeStyle": color - }) + IGVGraphics.strokeLine(ctx, lastPixelEnd, lastY, x, y, properties) } IGVGraphics.strokeLine(ctx, x, y, x + width, y, {"fillStyle": color, "strokeStyle": color}) } else if (this.graphType === "points") {