[Bug Report]: 使用插件 Snapshot 导出svg格式的图片时,配置了 partial: false,但只导出了可见区域的流程图
- Dominant language
- TypeScript
- Stars
- 11.7k
- Forks
- 1.4k
- PR merge metrics
- No merged PRs in 30d
Description
### 发生了什么?
使用插件 Snapshot 导出图片时,选择导出 png 格式的图片可以导出完整的流程图,选择导出 svg 格式只导出了可见区域的流程图。参数 partial 对 svg 无效。
操作步骤:放大至只显示部分区域后,分别保存 png 和 svg 格式的图片。
**放大后的效果:**
**PNG 格式:**
**SVG 格式:**
```vue
保存PNG
保存SVG
import LogicFlow from "@logicflow/core";
import "@logicflow/core/lib/style/index.css";
import { Snapshot } from "@logicflow/extension";
export default {
name: 'lf-Demo',
data() {
return {
renderData: {
// 节点数据
nodes: [
{
id: '21', // 节点ID,需要全局唯一,不传入内部会自动生成一个ID
type: 'rect', // 节点类型,可以传入LogicFlow内置的7种节点类型,也可以注册自定义节点后传入自定义类型
x: 100, // 节点形状中心在x轴位置
y: 100, // 节点形状中心在y轴的位置
text: 'Origin Usage-rect', // 节点文本
properties: { // 自定义属性,用于存储需要这个节点携带的信息,可以传入宽高以重设节点的宽高
width: 160,
height: 80,
}
},
{
id: '50',
type: 'circle',
x: 300,
y: 300,
text: 'Origin Usage-circle',
properties: {
r: 60,
}
},
],
// 边数据
edges: [
{
id: 'rect-2-circle', // 边ID,性质与节点ID一样
type: 'polyline', // 边类型
sourceNodeId: '50', // 起始节点Id
targetNodeId: '21', // 目标节点Id
},
],
}
}
},
mounted() {
this.lf = new LogicFlow({
container: this.$refs.container,
grid: true,
plugins: [Snapshot]
});
this.lf.render(this.renderData);
},
methods: {
handleClick(fileType) {
this.lf.getSnapshot("test", {
fileType,
partial: false
})
}
}
};
.container {
width: 800px;
height: 500px;
}
```
### logicflow/core版本
2.1.2
### logicflow/extension版本
2.1.4
### logicflow/engine版本
_No response_
### 浏览器&环境
Chrome
Contributor guide
Assessment
This issue has not been assessed yet.