使用jQuery从强制布局节点删除所有.fixed类 [英] Remove all .fixed classes from force layout nodes with jQuery

问题描述

我有这个结构，由d3.js强制布局：

  div id =familytreecontentsvg> 
< g class =nodes> 
< g class =nodetransform =translate（625.2095978696435,404.7159479251927）style =border：3px solid red;>< / g> 
< g class =nodetransform =translate（549.3595414086468,461.0475336079573）style =border：3px solid red;>< / g> 
< g class =node fixedtransform =translate（617.2898371986196,498.8572888164544）style =border：3px solid red;>< / g> 
< / g> 
  

最后，我想从所有节点中删除.fixed类。

所以触发这个事件我有一个按钮。要检查它是否工作，我只是为了演示添加一些CSS工作。不知何故，删除类不工作。不删除固定类：

  $（＃familytreeUnfixallbutton）click（function {）{
 $ （#familytreecontentsvg.node）.css（border，3px solid red）; 
 $（#familytreecontentsvg .node）.removeClass（fixed）; 
}因此，我如何从节点中删除所有固定类？   p> 
 
 
目前状态
 
 
 
这个正在运作：
  d3.select（'＃familytreeUnfixallbutton'）。on（'click'，function（）{
 d3.selectAll（'＃familytreecontentsvg .node'）。classed '，false）
}）; 
  
它删除固定类。但不知何故d3对此不感兴趣。它仍然是fixed =（
 
 
 
剩余的问题
 
 
 
我为剩余的问题创建了一个新问题：删除固定类不会从预设中正确删除它们 
解决方案
看起来jQuery addClass / removeClass / toggleClass不能使用SVG元素。 =http://bugs.jquery.com/ticket/10329 =nofollow> ticket 在jQuery上，但它是关闭的，它'不会修复'。
 
 
 
您可以使用 d3.selectAll（'＃familytreecontentsvg.node'）。classed（'fixed'，false）  jQuery.attr  。因此，您的代码应如下所示：
  $（＃familytreeUnfixallbutton）click（function（）{
 $（#familytreecontentsvg .node）.css ，3px solid red）; 
 d3.selectAll（'＃familytreecontentsvg.node'）。classed（'fixed'，false）
}）; 
  
希望这有帮助。
 
I have this structure, made by the d3.js force layout:
<div id="familytreecontentsvg">
<g class="nodes">
    <g class="node" transform="translate(625.2095978696435,404.7159479251927)" style="border: 3px solid red;"></g>
    <g class="node" transform="translate(549.3595414086468,461.0475336079573)" style="border: 3px solid red;"></g>
    <g class="node fixed" transform="translate(617.2898371986196,498.8572888164544)" style="border: 3px solid red;"></g>
</g>
And finally I would like to remove the .fixed classes from all nodes.

So triggering this event I have a button. To check if it's working I just for demonstrating added some css which worked. Somehow the remove class is not working. The fixed class is not removed:
$("#familytreeUnfixallbutton").click(function() {
    $( "#familytreecontentsvg .node" ).css( "border", "3px solid red" );
    $( "#familytreecontentsvg .node" ).removeClass( "fixed" );
});
So How can I remove all fixed classes from the nodes?

Current state

This one is working now:
d3.select('#familytreeUnfixallbutton').on('click', function(){
    d3.selectAll('#familytreecontentsvg .node').classed('fixed', false)
});
It removes the fixed class. But somehow d3 is not interested about this. It is still fixed =(

Remaining question

I created a new question for the remaining issue: Removing fixed classes does not properly remove them from the presetation
解决方案
It seems that jQuery addClass/removeClass/toggleClass do not work with SVG elements. There is a ticket on jQuery but it is closed and it 'won't fixed'.

You can use d3.selectAll('#familytreecontentsvg.node').classed('fixed', false) or the good old jQuery.attr. So your code should be like this:
$("#familytreeUnfixallbutton").click(function() {
    $( "#familytreecontentsvg .node" ).css( "border", "3px solid red" );
    d3.selectAll('#familytreecontentsvg.node').classed('fixed', false)
});
Hope this helps.

                        
这篇关于使用jQuery从强制布局节点删除所有.fixed类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！