javascript - D3 将数据添加到 3D 饼图

Question

下面是我从 D3 示例中找到的 js 代码 here .

var MsaSubGroup  = svg.append("g").attr("id","MsaSubGroupData").attr("class","pieChart");
Donut3D.draw("MsaSubGroupData", getData(MSA), 450, 150, 130, 100, 30, 0.4);

var wedges = MsaSubGroup.selectAll("g.slices").data(datum).enter();
        wedges.on("mousemove", function(d){ //This is what the browser is complaining about.
            mousex = d3.mouse(this);
            mousex = mousex[0];
            //console.log(d);
            d3.select(this)
                .classed("hover", true);

            tooltip.html(d.label+": " + d.value).style("visibility", "visible").style("left", mousex + "px" );
        });

我做了一些修改，尝试添加数据和工具提示。事实上，我只需要将数据绑定(bind)到 svg，这看起来非常简单。但是，我在控制台中遇到了奇怪的错误:

Uncaught TypeError: undefined is not a function

到底什么是未定义的？当我 console.log(datum) 时，我可以看到返回的对象数组，那么我做错了什么？

非常感谢。

Answer 1

您的楔子是 enter() 的结果调用哪个:

only defines the append, insert, select and call operators

因此它没有任何 on 方法，这就是导致“未定义不是函数”错误的原因。

我假设您想要:

var wedges = MsaSubGroup
        .selectAll("g.slices")
        .on('mousemove', ...);

wedges.data(myData).enter()...

或

var wedges = MsaSubGroup
        .selectAll("g.slices")
        .data(myData)
        .enter()
        .append('g')
        .on('mousemove', ...);