Javascript 无法对D3 v4中的对象使用attr
我一直在尝试用新的D3V4将一个不错的D3图表示例()转换为Angular2组件 但是,我确实收到一个“无法读取null的属性文本”异常,代码如下:Javascript 无法对D3 v4中的对象使用attr,javascript,d3.js,Javascript,D3.js,我一直在尝试用新的D3V4将一个不错的D3图表示例()转换为Angular2组件 但是,我确实收到一个“无法读取null的属性文本”异常,代码如下: var textLabels = labelGroups.append("text").attr({ x: function (d, i) { var centroid = pied_arc.centroid(d); var midAngle = Math.atan2(centroid[1
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;
});
var textLabels=labelGroups.append(“text”).attr({
x:功能(d,i){
var形心=pied_弧形心(d);
var midAngle=Math.atan2(质心[1],质心[0]);
var x=数学cos(中间角)*cDim.labelRadius;
变量符号=(x>0)?1:-1
var labelX=x+(5*符号)
返回标签;
},
y:函数(d,i){
var形心=pied_弧形心(d);
var midAngle=Math.atan2(质心[1],质心[0]);
变量y=数学sin(中间角)*cDim.labelRadius;
返回y;
},
“文本锚定”:函数(d,i){
var形心=pied_弧形心(d);
var midAngle=Math.atan2(质心[1],质心[0]);
var x=数学cos(中间角)*cDim.labelRadius;
返回(x>0)?“开始”:“结束”;
},
“类”:“标签文本”
}).text(函数(d,i){从D3 v4开始,您不能再使用对象来设置attr
或style
。为此,您必须参考迷你库D3选择:
<script src="https://d3js.org/d3-selection-multi.v0.4.min.js"></script>
对样式执行相同的操作:它应该是样式
,作为复数,而不是样式
如果您不想更改所有这些,只需按照“常规”方式执行:在单独的attr
中设置x
、y
、文本锚定
和class
以下是选择多个
文档:你能展示一个常规方式的例子吗:设置x,y
?谢谢!@Honghe.Wu像这样:selection.attr(“x”,foo.attr(“y”,bar).attr(“文本锚定”,baz.attr(“类,foobar”);
var textLabels = labelGroups.append("text").attrs({
//mind the 's' here-------------------------ˆ
});