【uniApp】ucharts 实现图表下载

由于移动端和PC端功能场景的差异,很多移动端绘制可视化图表是没有下载需求的,导致其在网上提供的解决方法很少,通过对代码的解析发现ucharts内部封装的有saveImage方法,直接调用可以直接保存至手机的相册中,具体方法如下:

html 复制代码
<uni-icons type="download" size="22" color="#04a1f4" @click="downImg()"></uni-icons>
<qiun-data-charts
	ref="myChart"
    type="line"
	:canvas2d="true"
	canvasId='myChart'  
	:opts="myChartOpt"
    :chartData="myChartData"
	:animation="false"
	:ontouch="true"
 />
javascript 复制代码
methods: {
	console.log(this.$refs.myChart) // 通过输出图表的this对象可以看到有saveImage方法,如上图所示
	this.$refs.myChart.saveImage()
}
相关推荐
Novlan14 分钟前
@tdesign/uniapp 图标瘦身
前端
ManThink Technology8 分钟前
如何使用EBHelper 简化EdgeBus的代码编写?
java·前端·网络
蓝帆傲亦9 分钟前
支付宝小程序性能暴增秘籍:UniApp项目极限优化全攻略
小程序·uni-app
. . . . .1 小时前
shadcn组件库
前端
2501_944711431 小时前
JS 对象遍历全解析
开发语言·前端·javascript
发现一只大呆瓜1 小时前
虚拟列表:支持“向上加载”的历史消息(Vue 3 & React 双版本)
前端·javascript·面试
css趣多多2 小时前
ctx 上下文对象控制新增 / 编辑表单显示隐藏的逻辑
前端
_codemonster2 小时前
Vue的三种使用方式对比
前端·javascript·vue.js
寻找奶酪的mouse2 小时前
30岁技术人对职业和生活的思考
前端·后端·年终总结
梦想很大很大2 小时前
使用 Go + Gin + Fx 构建工程化后端服务模板(gin-app 实践)
前端·后端·go