函数过滤器无法在d3js中正常工作

时间:2018-09-03 09:14:01

标签: javascript d3.js

我有这个HTML结构

<g class="type type-project" id="g-nsmart_city_lab" transform="translate(954.9537424482861,460.65694411587845)">
   <circle class="highlighter-circles" fill-opacity="0" r="70" fill="rgb(150,150,150)" id="hc-nsmart_city_lab"></circle>
   <circle class="node" r="50" fill="#768b83" id="nsmart_city_lab" filter="url(#blur)"></circle>
   <text font-family="Comic Sans MS" font-size="18px" fill="black" class="nodetext" id="t-nsmart_city_lab" style="text-anchor: middle;" x="0" y="0">SMART CITY LAB</text>
   <image href="./icons/project.svg" width="30" height="30" id="i-nsmart_city_lab" class="nodeimg"></image>
   <image href="./icons/expand2.svg" width="30" height="30" for-node="nsmart_city_lab" x="25" y="-45" id="ne-nsmart_city_lab" class="nodeexp" style="visibility: hidden;" data-expandable="false"></image>
   <circle class="inv_node" r="50" fill="red" fill-opacity="0" id="inv_nsmart_city_lab"></circle>
</g>

,我想使用满足特定条件的g元素。但是做的时候,

d3.selectAll("g.type").filter(g_element => g_element.class !== "whatever");

过滤器无法正常工作(至少对我而言)。 g_element.classundefined。调试后,由于某种原因,筛选返回<circle class="node" r="50" fill="#768b83" id="nsmart_city_lab" filter="url(#blur)"></circle>而不是g对象以访问其属性并进行筛选。

那怎么办呢?

这里有一个jsfiddle,它总是返回未定义的https://jsfiddle.net/k6Ldxtof/40/

0 个答案:

没有答案