Как сделать аннотацию вдоль линии в Vega-Lite для Javascript? - PullRequest
Новая
       43

Как сделать аннотацию вдоль линии в Vega-Lite для Javascript?

0 голосов
/ 31 марта 2020

Я сделал линейную диаграмму в Vega-Lite, используя Javascript. Я хотел бы отметить две строки, разместив текст вдоль них. Я просмотрел документацию и не могу найти способ сделать это. Кто-нибудь знает как? Вы можете увидеть мой график вместе с кодом в Observable здесь: https://observablehq.com/@biskwikman / michigan-covid-19-case

Линии, которые я хотел бы отметить, - это серые пунктирные линии, которые являются справочными линиями для различных темпов роста.

Мой соответствующий код ниже: 

    viewof lineCircle = vl.data(doubled).title('Total Cases of Covid-19 in Michigan')
  .encode(
    vl.x({timeUnit: 'monthdate'}).fieldT('date').title('Date (2020)').axis({labelAngle: 15}),
    vl.y().fieldQ('cases').scale({type: 'log', domain: [2, 20000]}).axis({values: [2, 10, 100, 1000, 4500, 10000, 20000]}).title('Cases')
  )
  .layer(
    vl.markLine({clip: true, color: 'gray', strokeDash: [8, 8]})
    .encode(
      vl.y().fieldQ('double')
    ),
    vl.markLine({clip: true, color: 'gray', strokeDash: [8, 8]})
    .encode(
      vl.y().fieldQ('threedays')
    ),
    vl.markLine(),
    vl.markCircle({size: 60})
      .encode(
        vl.tooltip().field('cases')
      )
    ).width(700).height(500).render()
...