我一直在尝试使用新的 D3 v4将一个不错的 D3 图表示例（https://jsfiddle.net/thudfactor/HdwTH/）转换为 Angular2 组件。

但是，我使用以下代码收到“无法读取 null 的属性文本”异常：

var textLabels = labelGroups.append("text").attr({
    x: function (d, i) {
        var centroid = pied_arc.centroid(d);
        var midAngle = Math.atan2(centroid[1], centroid[0]);
        var x = Math.cos(midAngle) * cDim.labelRadius;
        var sign = (x > 0) ? 1 : -1
        var labelX = x + (5 * sign)
        return labelX;
    },
    y: function (d, i) {
        var centroid = pied_arc.centroid(d);
        var midAngle = Math.atan2(centroid[1], centroid[0]);
        var y = Math.sin(midAngle) * cDim.labelRadius;
        return y;
    },
    'text-anchor': function (d, i) {
        var centroid = pied_arc.centroid(d);
        var midAngle = Math.atan2(centroid[1], centroid[0]);
        var x = Math.cos(midAngle) * cDim.labelRadius;
        return (x > 0) ? "start" : "end";
    },
    'class': 'label-text'
}).text(function (d, i) {      <--------------- exception
    return d.data.label;
});

labelgroups 是一个选择， append 应该可以工作，所以它一定是.attr({})导致问题的原因。然而，它在 jsfiddle 中运行良好。

此语法在 D3 v4 中是否有所更改？怎么会是正确的？