javascript - D3-tip 和 NPM : "TypeError: m.tip is not a function"

Question

我正在围绕 D3 编写 React 包装器，但在尝试使用 D3-tip 时出现错误:TypeError: m.tip is not a function。

我看过类似的帖子( here 和 here )，以及 this issue在 d3-tip GitHub 上，但对我来说都不起作用。我已经使用 NPM 安装了 D3 4.12.2 和 D3-tip 0.7.1，所以这些链接中提到的版本问题应该不适用。

相关代码如下所示:

import * as d3 from 'd3';
import * as d3Tip from 'd3-tip';

svg = d3.select('#' + divId)
                    .append('svg')
                    .attr('width', width)
                    .attr('height', height);

g_node = svg.append('g')
                    .attr('id', 'g_node');

var node_circles = g_node.selectAll('circle')
                                .data(dataset, function(d) { return d.name; });

var tool_tip = d3Tip.tip()
        .attr('class', 'd3-tip')
        .offset([-8, 0]);

svg.call(tool_tip);

node_circles.enter()
                .append('circle')
                .attr('cx', function(d) { return projection(d.pos)[0]; })
                .attr('cy', function(d) { return projection(d.pos)[1]; })
                .attr('r', '' + NODE_RADIUS + 'px')
                .attr('fill', 'blue')
                .on('mouseover', function(d) {
                    tool_tip.show(d);
                })
                .on('mouseout', function(d) {
                    tool_tip.hide(d);
                });

关于如何解决这个问题有什么想法吗？

Answer 1

为了让它正常工作，我会调整一些东西。

例如，

别名导入可以很简单从“d3-tip”导入 d3Tip

d3Tip 是从 d3-tip 存储库中的索引文件返回的默认函数的别名。

在此之后，调用 d3Tip 以获得 tip 对象，例如调用 d3Tip() 获取您正在使用的 var tooltip。

现在，您有了一个提示对象，不再需要调用 .tip() :)