功能概述:在当前一张许多节点的画布中,仅展示某些节点,其它的透明度为0(占位的,相当于css的opacity:0),并且在视口范围内居中它们(展示的那些)。
查看Antv G6官方文档,找到fitView这个方法,
但问题是fitView中是根据canvas整个画布大小来适应的,不支持自定义居中范围。所以看了下源码,这地方改一下就能满足需求了:
- 循环所有节点,找到展示的节点,并把它的x轴坐标放入x轴数组中,把它的y轴坐标放y轴数组中;如果这两个数组有一个为空则结束
- 获得画布宽度=x轴最大值-x轴最小值 ——groupWidth
- 获得画布高度=y轴最大值-y轴最小值 ——groupHeight
- 之后的代码就直接copy就行哈哈,关键就改bbox的属性,把它改为展示画布的宽高。
fitViewByRules函数中,接收3个参数:
onlyOutOfViewPort:true || false//如果为true,代表画布没超出视口的会被放大居中
direction:'x' || 'y'|| 'both' // 以哪边方向的缩放比为准,如果是x轴,有可能上下两端会超出视图
ratioRule:'min' || 'max' // 如果direction是both,会根据x轴和y轴取最大值或最小值比较得到缩放比例
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。