【uniApp】ucharts 实现图表下载

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

<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"
 />
methods: {
	console.log(this.$refs.myChart) // 通过输出图表的this对象可以看到有saveImage方法,如上图所示
	this.$refs.myChart.saveImage()
}

相关推荐

  1. js 实现图片纵向拼接并下载

    2024-07-13 17:08:02       30 阅读
  2. vue 实现调起打印机打印图片图片下载

    2024-07-13 17:08:02       54 阅读
  3. 使用.net core MVC实现图片上传下载

    2024-07-13 17:08:02       49 阅读
  4. 微信小程序实现图片下载与保存功能

    2024-07-13 17:08:02       145 阅读
  5. uniapp实现点击图片预览放大,长按下载图片

    2024-07-13 17:08:02       36 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-13 17:08:02       70 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-13 17:08:02       74 阅读
  3. 在Django里面运行非项目文件

    2024-07-13 17:08:02       62 阅读
  4. Python语言-面向对象

    2024-07-13 17:08:02       72 阅读

热门阅读

  1. react学习——29react之useState使用

    2024-07-13 17:08:02       23 阅读
  2. MobaXterm使用

    2024-07-13 17:08:02       18 阅读
  3. OSPF注意事项

    2024-07-13 17:08:02       22 阅读
  4. 数据结构第22节 堆排序优化

    2024-07-13 17:08:02       20 阅读