访问parent属性设置儿童

问题描述：

<g style="fill: rgb(49, 130, 189);" transform="translate(0,0)" x="200" class="chr"> 
    <circle cy="175.92776604033872" r="3"></circle> 
    <circle cy="292.4129588695106" r="3"></circle> 
</g>

我想设置圆的CX属性，为此，我需要访问母公司的x属性。

ch.selectAll('circle') 
    .data((d) => { 
     return d.values; 
    }) 
    .enter().append('circle') 
    .attr('r', 3) 
    .attr('cx', (d) => { 
     ... 
    }) 
    .attr('cy', (d) => { 
     return y(d.num); 
    });

有谁知道设置cx值时，我怎么能得到x属性的值：下面我的代码给出？提前致谢！！

只是一个提示，与您的问题无关：g元素没有x或y位置。 –

@GerardoFurtado有趣的是，我前几天还在[评论]中将这个引入了用户的注意（http://stackoverflow.com/questions/38544504/reading-csv-data-to-display-in-scatter-plot -with-d3-js＃comment64484402_38544504）在他们的另一个问题相同的代码。另一方面，这些属性是没有意义的，并且不会对SVG造成任何伤害，但它可能是某种方式来传达像Mark在他的回答中提到的通知。 – altocumulus

是的，你是绝对正确的，你可以用它来存储信息。但我认为编程人员和程序员应该使用相同的*语言*：当在SVG中看到“x”时，人们会考虑x位置...... –

答

考虑到@ GerardoFurtado的评论，我会认为你是积攒使得x值有其他原因，然后定位...

可以作为访问父（与x属性）：

.attr('cx', function(d) { 
    var parentXValue = d3.select(this.parentNode).attr("x"); 
})

Upvoted。我没有测试过，但是在那种情况下用'this'做胖箭头是否正常？ –

@GerardoFurtado好点！使用胖箭头功能时，'this'不会引用元素。您将需要一个正常的函数表达式。 – altocumulus

@GerardoFurtado和高积云，感谢捕捉！修正了我的答案。 – Mark

访问parent属性设置儿童

相关推荐