When Edge is set to hide, there is a problem dragging the canvas and exporting images

### Describe the bug / 问题描述

问题1：edge在style设置隐藏后，使用drag-canvas、zoom-canvas 和 optimize-viewport-transform 一起使用时，拖拽画布和缩放画布时，会导致edge隐藏失效；

问题2：edge在style设置隐藏后，导出的图片箭头不会隐藏，导出和图片和画布上显示的不符；

复现代码：
`
import { Graph } from '@antv/g6';
const data = {
nodes: new Array(16).fill(0).map((_, i) => ({ id: `node${i + 1}` })),
edges: [
'default-arrow',
'triangle-arrow',
'simple-arrow',
'vee-arrow',
'circle-arrow',
'rect-arrow',
'diamond-arrow',
'triangleRect-arrow',
].map((id, i) => ({
id,
source: `node${i * 2 + 1}`,
target: `node${i * 2 + 2}`,
style: {
visibility: 'hidden'
}
})),
};
const graph = new Graph({
data,
edge: {
style: {
labelText: (d) => d.id,
labelBackground: true,
endArrow: true,
startArrow: true,
endArrowType: (d) => d.id.split('-')[0],
},
},
layout: {
type: 'grid',
cols: 2,
},
behaviors: ['optimize-viewport-transform', 'drag-canvas', 'zoom-canvas']
});
graph.render();
const handleDownload = async () => {
const dataURL = await graph.toDataURL({
encoderOptions: 1, // 图片质量
type: 'image/png',
mode: 'overall',
});
const [head, content] = dataURL.split(',');
const contentType = head.match(/:(.*?);/)[1];
const bstr = atob(content);
let length = bstr.length;
const u8arr = new Uint8Array(length);
while (length--) {
u8arr[length] = bstr.charCodeAt(length);
}
const blob = new Blob([u8arr], { type: contentType });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = `test.png`;
a.click();
}
setTimeout(() => {
handleDownload()
}, 1000)
`

### Reproduction link / 重现链接

https://stackblitz.com/edit/react-eyqgta?file=index.js

### Steps to Reproduce the Bug or Issue / 重现步骤


### G6 Version / G6 版本

🆕 5.x

### Operating System / 操作系统

Windows

### Browser / 浏览器

Chrome

### Additional context / 补充说明

问题1：edge在style设置隐藏后，使用drag-canvas、zoom-canvas 和 optimize-viewport-transform 一起使用时，拖拽画布和缩放画布时，会导致edge隐藏失效；

问题2：edge在style设置隐藏后，导出的图片箭头不会隐藏，导出和图片和画布上显示的不符；