Как нарисовать вертикальную линию через точки наведения на линейном графике?Chart.js - PullRequest
Новая
       37

Как нарисовать вертикальную линию через точки наведения на линейном графике?Chart.js

0 голосов
/ 08 мая 2019

Я использую chart.js, чтобы заменить все мои графики, используя d3 в моем приложении. Один из этих графиков рисует вертикальную линию через выбранные точки при наведении. Что-то вроде этого: диаграмма областей с вертикальной линией

Я не могу найти ничего подобного в примерах, есть ли что-нибудь, что можно сделать с помощью chart.js?

Я пытался использовать всплывающую подсказку и настройки параметров оси, но безуспешно

Я использую версию реагирования, поэтому мой компонент сейчас выглядит так: 

const MyAreaChart = ({ data, labels, classes }) => {
    return (
       <Line
          data={{
            labels,
            datasets: Object.entries(data).map(([assetType, dataArray]) => ({
              fill: true,
              label: classes[assetType].name,
              backgroundColor: classes[assetType].color,
              pointRadius: 0,
              steppedLine: true,
              data: dataArray
            }))
          }}
          options={{
            tooltips: { mode: 'label', intersect: false },
            scales: {
              xAxes: [{
                stacked: true,
                display: true,
                ticks: {
                  callback: (dataLabel, index) => index % 30 === 0 ? formatMonth(dataLabel) : null
                }
              }],
              yAxes: [{ stacked: true }]
            }
          }}
        />
    );
}

Я ожидаю увидеть вертикальную линию, хотя мои точки при наведении курсора (когда отображается подсказка)

...