如何在滚动时隐藏 nvd3 工具提示

【问题标题】：How to hide nvd3 tooltip on scroll如何在滚动时隐藏 nvd3 工具提示
【发布时间】：2015-10-16 19:14:59
【问题描述】：

当用户滚动页面时，我试图隐藏折线图的工具。

var 图表 = nv.models.lineChart() .interpolate("基数") .margin({left: 50}) .useInteractiveGuideline(true) .duration(500) .showLegend(真) .showYAxis(真) .showXAxis(true); //... 获取数据并绘制它。 $(window).on("滚动", function(){ chart.interactiveLayer.tooltip.hidden(true); chart.tooltip.hidden(true); });

以上都不起作用。我错过了什么吗？

【问题讨论】：

你有什么错误吗？
抱歉，控制台没有错误。

标签： nvd3.js

【解决方案1】：

我可以使用 angular 12 和 https://github.com/krispo/ng2-nvd3 来处理这个问题。在我的情况下，在触摸屏设备上滚动并触摸图表时，工具提示固定在屏幕的左上角。

import { HostListener } from '@angular/core';
...
export class NameComponent {
    constructor() {}

    @HostListener('touchmove') touchmove(): void {
    d3.select(window).on('scroll', () => {
      d3.selectAll('.nvtooltip').style('opacity', '0');
    });
  }
}

https://github.com/krispo/angular-nvd3/issues/427#issuecomment-382711323

【讨论】：