如何使用 D3.select 选择指令的父级？答案

【问题标题】：How to select parent of directive with D3.select?如何使用 D3.select 选择指令的父级？
【发布时间】：2015-09-18 20:53:18
【问题描述】：

我正在尝试获取指令父级的高度，其想法是自动调整图表的大小以适应其父级 html 容器。感觉这个问题已经解决了一百万次，但我不知道为什么我的代码不起作用 - 我认为我的错误与 Angular.js 相关，而不是 D3。

改编了http://www.ng-newsletter.com/posts/d3-on-angular.html的非常好的教程，这是我的代码：http://codepen.io/anon/pen/QjNodL

我观察窗口大小的变化并执行这个函数：

scope.render = function(data) {
    var svg = parent.append('svg');

    renderTimeout = $timeout(function() {
          var width = d3.select(ele[0])[0][0].offsetWidth - margin,
              height = d3.select(ele[0]).node().getBoundingClientRect().height;
              svg.attr('height', height);

这是 HTML：

<div class="col-md-12" style="height: 100px;">
    <d3-bars bar-height="20" bar-padding="5" data="ragChartData" on-click="onClick(item)" style="height: 100px;">
    </d3-bars>
</div>

很遗憾

d3.select(ele[0])

选择指令

<d3-bars></d3-bars>

但它不是父级，我不知道如何选择它。

【问题讨论】：

标签： javascript angularjs d3.js

【解决方案1】：

您可以尝试使用这样的选择功能：d3.select(ele[0].parentNode)

【讨论】：