# All files / utils drawLines.ts

64.58% Statements 31/48
40% Branches 4/10
57.14% Functions 4/7
70.59% Lines 24/34

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    631x
    1x

    1x
    1x

    1x
    5x
    5x
    5x
    5x
    5x
    5x
    5x

    5x

    5x
    5x

    5x
    5x

    15x
    15x

    15x

    5x
    5x
    5x
    5x

     import {line, curveLinear, area} from 'd3-shape'
    import {range} from 'd3-array'

    import {LineInterpolation, LineData} from '../types'
    import {CURVES} from '../constants'
    import {isDefined} from '../utils/isDefined'

    interface DrawLinesOptions {
      context: CanvasRenderingContext2D
      interpolation: LineInterpolation
      lineData: LineData
      lineWidth: number
      shadeBelow: boolean
      shadeBelowOpacity: number
      shadeAboveY: number
    }

    export const drawLines = ({
      context,
      lineData,
      interpolation,
      lineWidth,
      shadeBelow,
      shadeBelowOpacity,
      shadeAboveY,
    }: DrawLinesOptions): void => {
      Iif (shadeBelow) {
        for (const {xs, ys, fill} of Object.values(lineData)) {
          const areaGenerator = area<number>()
            .y0(shadeAboveY)
            .y1((i: any) => ys[i])
            .x((i: any) => xs[i])
            .context(context)
            .defined((i: any) => isDefined(xs[i]) && isDefined(ys[i]))
            .curve(CURVES[interpolation] || curveLinear)

          context.fillStyle = fill
          context.globalAlpha = shadeBelowOpacity
          context.beginPath()
          areaGenerator(range(0, xs.length))
          context.fill()
        }
      }

      context.lineWidth = lineWidth
      context.globalAlpha = 1

      for (const {xs, ys, fill} of Object.values(lineData)) {
        const lineGenerator = line<number>()
          .context(context)
          .y((i: any) => ys[i])
          .x((i: any) => xs[i])
          .context(context)
          .defined((i: any) => isDefined(xs[i]) && isDefined(ys[i]))
          .curve(CURVES[interpolation] || curveLinear)

        context.strokeStyle = fill
        context.beginPath()
        lineGenerator(range(0, xs.length))
        context.stroke()
      }
    }