d c. js: невозможно прокрутить график, даже после установки mouseZoomable в false

Question

Фон

Я создал диаграмму и реализовал функцию "щелчок для увеличения / уменьшение мышки до сброса" следующим образом.

chart.on('pretransition', (c) => {
  // click to enable zooming
  c.select('svg').on('click.enablemousezoomable', () => {
    c.focus();
    c.mouseZoomable(true).render();
  });

chart.on('postRedraw', (c) => {
  // mouseleave to disable zooming
  c.select('svg').on('mouseleave.disablemousezoomable', () => {
    c.focus();
    c.mouseZoomable(false).render();
  });
});

Проблема

Хотя функция работает, как и предполагалось, проблема в том, что после перерисовки прокрутка страницы невозможна, если курсор остается на диаграмме.

Курсор должен быть переместился с графика, чтобы заставить работать прокрутку страницы.

Вопрос

Что может быть причиной этой проблемы и как ее решить?

Спасибо!

Answer 1

Я сделал блок из примера акции d c. js, который использует mouseZoomable в графике Ежемесячный индекс Abs Move & Volume / 500 000 , и применил ваши изменения .

Действительно, он отключает масштабирование, но все равно оставляет колесо отключенным после того, как mouseZoomable было отключено.

Как d c .js # 991 Обсуждает, что способ d c. js снимает масштабирование некорректно. В соответствии с документацией d3-zoom , это должно быть правильно:

moveChart._nullZoom = function(sel) {
    sel.on('.zoom', null);
};

Действительно, я пробовал это в этой вилке блока , и, похоже, работать намного лучше Я думаю, что это правильное решение и для связанной проблемы.

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