D3 - добавить класс к выбранному родителю - PullRequest
0 голосов
/ 19 января 2020

У меня есть демо здесь

Это простая гистограмма D3 в приложении angular.

Я хочу проверить, имеет ли текст по оси X 'Feb' в нем.

Если это так, я хочу добавить класс к родителю g

<g class="tick CLASS ADDED HERE" opacity="1" transform="translate(42.77777777777778,0)">
    <line stroke="#000" y2="6"></line>
    <text fill="red" y="16" dy="0.71em">Feb</text>
</g>

Я могу определить текст и стилизовать его, но я бы хотел, чтобы класс был добавлен в родитель г

private accessTicks() {
      d3.selectAll(".x-axis text")
        .filter(d => d === 'Feb')
        .attr("fill", 'red')
        //d3.selectAll(this.previousSibling)
        //.attr('class', '')
    }   

1 Ответ

1 голос
/ 19 января 2020

Я думаю, это то, что вам нужно:

...
private accessTicks() {
  let selection = d3.selectAll(".x-axis text")
      .filter((d) => {  return d === 'Feb'})
      .attr("fill", 'red')

    // this will allow you to select the parent of your selected element.
    let selectionParent = selection.select(function () {
      console.log(this.parentNode);
      return this.parentNode
    });

    selectionParent.classed("feb-parent", true);
}
...

Обновление : исправлена ​​проблема с дублированием, мой предыдущий код переопределял атрибут tick classList, теперь я добавляю новый класс вместо этого.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...