d3之批量显示所选对象,点击父对象,标注所有子对象

功能点描述:当有父子关系的时候,点击父对象,将所属的所有子对象标注显示。

思路:

1.是否和单个对象的显示思路相同?
现在看来,是的,和单个对象的思路相同,单个对象的要求是每次只标注一个节点,所有给<path>创建一个id,批量显示就给每次创建一个<path>,并归成一个类别。

2.是否需要用到 <defs> 属性?
查阅了svg <defs> 的相关资料之后,感觉不适合在这里使用,因为<defs>一定要搭配<use>使用,暂时还没找到在 <script>代码中控制<use>的方法,故放弃。
解决方案:
每次判断,当点击子网或者控制器这种父节点时,判断其下面有无子节点,有子节点通过一个字段标注,然后判断所有子节点中该字段,并创建<path>,将其归为类,然后对这类别进行操作。
有一个隐患,此法应该有待优化,因为每次都会创建大量的<path>,而且也不会清理,会非常卡。
解决的方法:把之前修改<path>属性为隐藏的地方,全部更改代码,直接清除掉这些<path>。d3.selectAll(".paths").remove();

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容