huoxingdeni的博客

原创 前端使用 Konva 实现可视化设计器- 对齐效果

判断 hover，这里使用 Konva.Util.haveIntersection，判断两个 rect 是否重叠，鼠标表达为大小为 1 的 rect。首先，拖入元素的时候，给每个节点准备一个 Konva.Rect 作为 hover 效果，默认不显示，且列入忽略的部分。需要注意的是，hover 优先级是基于节点的 zIndex，所以判断 hover 之前，需要进行一次排序。基于目标，比较特别，在多选的情况下，给内部的节点增加一个 hover 效果。在多选区域的空白处的时候右键，功能与按钮一样，不多赘述。