功能點描述:當(dāng)有父子關(guān)系的時候,點擊父對象,將所屬的所有子對象標(biāo)注顯示。
思路:
1.是否和單個對象的顯示思路相同?
現(xiàn)在看來,是的,和單個對象的思路相同,單個對象的要求是每次只標(biāo)注一個節(jié)點,所有給<path>創(chuàng)建一個id,批量顯示就給每次創(chuàng)建一個<path>,并歸成一個類別。
2.是否需要用到 <defs> 屬性?
查閱了svg <defs> 的相關(guān)資料之后,感覺不適合在這里使用,因為<defs>一定要搭配<use>使用,暫時還沒找到在 <script>代碼中控制<use>的方法,故放棄。
解決方案:
每次判斷,當(dāng)點擊子網(wǎng)或者控制器這種父節(jié)點時,判斷其下面有無子節(jié)點,有子節(jié)點通過一個字段標(biāo)注,然后判斷所有子節(jié)點中該字段,并創(chuàng)建<path>,將其歸為類,然后對這類別進(jìn)行操作。
有一個隱患,此法應(yīng)該有待優(yōu)化,因為每次都會創(chuàng)建大量的<path>,而且也不會清理,會非常卡。
解決的方法:把之前修改<path>屬性為隱藏的地方,全部更改代碼,直接清除掉這些<path>。d3.selectAll(".paths").remove();