diff --git a/src/components/continuous/drawLinesCanvas.js b/src/components/continuous/drawLinesCanvas.js new file mode 100644 index 00000000..32cbd987 --- /dev/null +++ b/src/components/continuous/drawLinesCanvas.js @@ -0,0 +1,50 @@ +import { + project +} from "./util"; + +/***************************************** +****************************************** + draw loop +****************************************** +******************************************/ + +const drawLinesCanvas = (ctx, dimensions, xscale) => { + return (d) => { + + // ctx.strokeStyle = d["Sample.name.color"]; + ctx.strokeStyle = "rgba(0,0,0,1)"; + ctx.beginPath(); + var coords = project(d, dimensions, xscale); + coords.forEach((p,i) => { + // this tricky bit avoids rendering null values as 0 + if (p === null) { + // this bit renders horizontal lines on the previous/next + // dimensions, so that sandwiched null values are visible + if (i > 0) { + var prev = coords[i-1]; + if (prev !== null) { + ctx.moveTo(prev[0],prev[1]); + ctx.lineTo(prev[0]+6,prev[1]); + } + } + if (i < coords.length-1) { + var next = coords[i+1]; + if (next !== null) { + ctx.moveTo(next[0]-6,next[1]); + } + } + return; + } + + if (i == 0) { + ctx.moveTo(p[0],p[1]); + return; + } + + ctx.lineTo(p[0],p[1]); + }); + ctx.stroke(); + } +} + +export default drawLinesCanvas;