@antv/x6 导出图片下载,或者导出图片为base64由后端去处理。

1、导出为文件的格式,比如 PNG

复制代码
graph.exportPNG(
      function (dataURL) {
        console.log(dataURL);
        let img = document.getElementById('img') as HTMLImageElement;
        img.src = dataURL;
      },
      {
        backgroundColor: '#fff',
        padding: [20, 20, 20, 20],
        quality: 1,
        width: graph.options.width,
        height: graph.options.height,
      },
    );

导出的时候,会弹出文件下载,或者自动下载文件。

2、导出为base64格式的图片

这个只要把1中的方法名称调换下就可以了。

3、这里面只可以导出背景色,不能导出图片背景。

4、官方地址:https://x6.antv.antgroup.com/tutorial/plugins/export#graphtosvg

相关推荐
雪芽蓝域zzs6 小时前
第 2 节:基础扩展 - 下拉弹窗常用原生属性
vue.js·elementui
xxwl58517 小时前
vue3的入门学习
前端·vue.js·学习
web打印社区18 小时前
政务办事大厅:叫号小票、办理回执网页怎么静默出纸
前端·javascript·vue.js·pdf·html·政务
斯内普吖18 小时前
(开源)水果蔬菜商城实战指南 基于 Java + SSM + Vue + MySQL
java·vue.js·mysql·开源
ss27319 小时前
AI全栈实战 | 2.2-02 React 思维模型:数据不可变 vs Vue 数据可变,两种哲学把复杂度推给谁
前端·vue.js·react.js
天衍四九-19 小时前
Docker Compose企业实战系列(三):Vue/React前端项目容器化完整部署
前端·vue.js·docker
墨鱼老师20 小时前
SpringBoot+Vue 毕设项目开发踩坑记录(前后端分离)
vue.js·spring boot·毕业设计·课程设计·前后端分离·java 毕设
雪芽蓝域zzs20 小时前
Vue3 + Element Plus el-select 下拉弹窗
vue.js·elementui
Wx-bishekaifayuan21 小时前
springboot房屋租赁系统11574-计算机课程设计、毕业设计
java·vue.js·spring boot·后端·sql·spring·课程设计
小白的码BUG之路21 小时前
Docker -- 构建nginx镜像,启动vue项目
vue.js·nginx·docker