echarts图片保存
一.js:
function updateChart(versionList,rateList) { option = { title: { text: '拖动频次' }, tooltip : { trigger: 'axis', axisPointer : { // 坐标轴指示器,坐标轴触发有效 type : 'shadow' // 默认为直线,可选为:'line' | 'shadow' } }, legend: { itemWidth:15, itemHeight:15, data:['拖动频次[拖动次数/小时]'], }, animation : false, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis : [ { type : 'category', data : versionList, axisTick: { alignWithLabel: true } } ], yAxis : [ { type : 'value', name:'次/小时', axisLabel: { formatter: '{value}', } }, ], series : [ { name:'拖动频次[拖动次数/小时]', type:'bar', barWidth: '50%', itemStyle:{ normal:{ color:'rgba(58,95,205,1)', borderType : 'dashed', barBorderRadius:[10, 10, 10, 10], } }, label: { normal: { show: true, position: 'top', textStyle: { color: 'black' } } }, data:rateList } ] }; chart.setOption(option, true); var projectId = GetQueryString('projectId'); picLoad(chart.getDataURL(),"/Btm20LCDDragfrequency"+projectId+".png"); } 注意: animation : false, 否则图片不能保存
function picLoad(dataPic,picName){ $.ajax({ type : 'POST', url : '/ajax/loadPic', data : { "data" :dataPic, "name" : picName }, contentType : "application/x-www-form-urlencoded", success : function(data) { } }); } 解释: 1.chart.getDataURL()方法获取base64编码,获取的结果是: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABI4AAAEsCAYAAAClh/jbAAA ... 在"base64,"之后的才是图片信息
二.后台
@RequestMapping(value = "/loadPic", method = RequestMethod.POST, produces = {"application/json;charset=UTF-8"}) public @ResponseBody Map<String, Object> reg(HttpServletRequest request, HttpServletResponse response) { Map<String, Object> result = new HashMap<String, Object>(); String name = request.getParameter("name"); String[] picData = request.getParameter("data").split(","); try { byte[] n = new BASE64Decoder().decodeBuffer(picData[1]); String path = Thread.currentThread().getContextClassLoader().getResource("").getPath(); path = path + "folderPath.properties"; Properties prop = new Properties(); prop.load(new FileInputStream(path)); String filePath = prop.getProperty("UploadPicImagePath"); File fp = new File(filePath); if (!fp.exists()) { fp.mkdirs(); } OutputStream out = new FileOutputStream(new File(filePath+name)); out.write(n); out.flush(); out.close(); result.put("code", 200); } catch (FileNotFoundException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } logger.info(name+" save success"); return result; }
三.获取图片
@Override public boolean sendFingerReport(Integer projectId, Integer versionId, String userGroup, Btm20LCDEmailConfig emailConfig) throws Exception { Map<String, Object> emailMap = new HashMap<String, Object>(); // 版本 Version version = this.versionService.getVersionById(versionId); emailMap.put("version", version); emailMap.put("projectId", projectId); String path = Thread.currentThread().getContextClassLoader().getResource("").getPath(); path = path + "folderPath.properties"; Properties prop = new Properties(); prop.load(new FileInputStream(path)); String filePath = prop.getProperty("UploadPicImagePath"); File f1 = new File(filePath + "/Btm20LCDAPPBrigthDrag" + projectId + ".png"); if (f1.exists()) { emailMap.put("Btm20LCDAPPBrigthDrag", filePath + "/Btm20LCDAPPBrigthDrag" + projectId + ".png"); } // 收件人 String receiver = ""; if (emailConfig != null && !CheckUtils.isNullOrBlank(emailConfig.getReciverId())) { TmGroup tmGroup = this.tmGroupService.selectTmGroupById(emailConfig.getReciverId()); if (!CheckUtils.isNullOrBlank(tmGroup) && !CheckUtils.isNullOrBlank(tmGroup.getMemberArr())) { String[] groupMembers = tmGroup.getMemberArr().split(","); for (int i = 0; i < groupMembers.length; i++) { receiver += this.personInfoService.selectPersonInfoById(Integer.parseInt(groupMembers[i])) .getEmail() + ","; } } } String mailText = templateEmailService.getMailText("/btm20/email/btm20LcdMail.ftl", emailMap); Email email = new Email(); email.setEmail(true);// 标记收件人是不是邮箱 email.setSubject(emailConfig.getSubject()); email.setTo(receiver); email.setCc(copyTo); email.setContent(mailText); boolean send = EmailServerTerminal.send(email,"btm20"); return send; }
echarts图片保存的更多相关文章
- Java - PhantomJS + EChartsConvert实现ECharts图片保存到服务端
1.所需工具 1>phantomjs:官网下载http://phantomjs.org/download.html 国内镜像http://npm.taobao.org/dist/phantomj ...
- ECharts外部调用保存为图片操作及工作流接线mouseenter和mouseleave由于鼠标移动速度过快导致问题解决办法
记录两个项目开发中遇到的问题,一个是ECharts外部调用保存为图片操作,一个是workflow工作流连接曲线onmouseenter和onmouseleave事件由于鼠标移动过快触发问题. 一.外部 ...
- php 获取远程图片保存到本地
php 获取远程图片保存到本地 使用两个函数 1.获取远程文件 2.把图片保存到本地 /** * 获取远程图片并把它保存到本地 * $url 是远程图片的完整URL地址,不能为空. */ functi ...
- 用qt代码怎样编写图片保存格式[qt4.6]
用qt代码怎样编写图片保存格式 qt提供了多个保存图片的接口,比较常用的接口如下 bool QPixmap::save ( const QString & fileName, const ch ...
- iOS 将图片保存到本地
//将图片保存到本地 + (void)SaveImageToLocal:(UIImage*)image Keys:(NSString*)key { NSUserDefaults* prefer ...
- C# 图片保存到数据库和从数据库读取图片并显示
图片保存到数据库的方法: public void imgToDB(string sql) { //参数sql中要求保存的imge变量名称为@images //调 ...
- file_put_contents() 图片保存 函数成功之后返回值
今天弄图片保存时,用到file_put_contents()来保存图片,运行了几次,发下一直没有数据出来,以为是这个函数没操作成功 于是查看了下这个函数的用法和返回值,发现我输出的返回都正确,后来才发 ...
- iOS9中将图片保存到照片中的某个相册的方法说明
iOS9中将图片保存到照片中的某个相册的方法说明 在App中很经常遇到的就是用户点击某张图片后将图片保存到本地,下面介绍下iOS中保存图片的一些东西 1.首先,在iOS中把图片保存到系统照片是比较简单 ...
- 24位和8位BMP图片保存纯C代码
BMP图片大家都知道,可以通过查看BMP图片结构使用纯C就可以打开,编辑,处理,保存图片.非常方便使用. 具体BMP结构可以参考:wingdi.h头文件.今天主要在进行删减代码,需要把多余的代码删除, ...
随机推荐
- CentOS 7.0下解决ifconfig: command not found的方法
在CentOS7.0中输入ifconfig命令会遇到-bash: ifconfig: command not found. 在CentOS最小安装时是没有附带ifconfig,我们进入sbin目录下可 ...
- Ubuntu16.04下iTop4412环境搭建+Android4.0.3编译
系统:Ubuntu16.04.02(优麒麟) 安装库文件和JDK 使用cd 命令,进入解压出来的“Android_JDK” -->“jdk6”文件夹,运行脚本文件 “install-sun-ja ...
- Vue学习之路8-v-on指令学习简单事件绑定之属性
前言 上一篇文章以v-on指令绑定click事件为例介绍了v-on指令的使用方法,本文介绍一下v-on绑定事件的一些属性的使用方法. v-on绑定指令属性 .stop属性 阻止单击事件继续向上传播(简 ...
- 使用Razor Generator构建模块化ASP.NET MVC应用程序
在构建Web应用程序的时候,我们很难做到模块化的开发,这是因为Web应用程序不仅仅包含编译的C#代码,还包含了js.css和aspx等资源. 在ASP.NET MVC中,我们发布应用程序的时候,还会包 ...
- 02.Python网络爬虫第二弹《http和https协议》
一.HTTP协议 1.官方概念: HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于从万维网(WWW:World Wide Web )服务器传输超文 ...
- bootstrap的datepicker在选择日期后调用某个方法
bootstrap的datepicker在选择日期后调用某个方法 2016-11-08 15:14 1311人阅读 评论(0) 收藏 举报 首先感谢网易LOFTER博主Ivy的博客,我才顿悟了问题所在 ...
- angular5 组件通信(一)
用了两年angular1,对1的组件通信比较熟练,最直接的就是直接使用scope的父子节点scope就可以实现,且基本都是基于作用域实现的通信:还有就是emit,broadcast,on这几个东西了. ...
- 如何给30台centos7服务器分别增加相同的用户
老大直接给了30台新鲜的生产服务器,要给每一台服务器增加一个用户,密码相同 难道我们要部署一个工具吗?这样对生产环境可能会产生影响,为了保证服务器的新鲜以及节约时间,研究了小半天,终于研究出一个不是很 ...
- GUNS后台管理框架部署与发布
一.GUNS介绍 Guns基于SpringBoot,致力于做更简洁的后台管理系统,完美整合springmvc + shiro + mybatis-plus + beetl + flowable!Gun ...
- 90道Python面试题,做对80%直击年薪40w
转发链接: 1.一行代码实现1--100之和 利用sum()函数求和 2.如何在一个函数内部修改全局变量 函数内部global声明 修改全局变量 3.列出5个python标准库 os:提供了不少与操作 ...