美文网首页
Echart 增加自定义下载Excel功能

Echart 增加自定义下载Excel功能

作者: 皇甫贝 | 来源:发表于2019-04-05 20:25 被阅读0次

在项目中你所遇到的项目需求各个奇葩, 我今天就遇到一个,图片和Excel下载功能还有自定义Icon
1.首先Echart的Icon支持Png/Jpg/SVG三种格式
2.Echart自带toolbox--feature属性,他可以支持你的自定义的Icon设置和点击回调
代码:

 toolbox: {
                feature: {
                    myTool1: {
                        show: true,
                        title: '显示统计图',
                        icon: 'image://../Images/orderedList0.png',
                        onclick: function (){
                            callbackTitleOne();
                        }
                    },
                    myTool2: {
                        show: true,
                        title: '详情页',
                        icon: 'path://M950.856124 877.714442v73.142779H73.142779v-73.142779h877.713345m0-73.142778H73.142779a73.142779 73.142779 0 0 0-73.142779 73.142778v73.142779a73.142779 73.142779 0 0 0 73.142779 73.142779h877.713345a73.142779 73.142779 0 0 0 73.142779-73.142779v-73.142779a73.142779 73.142779 0 0 0-73.142779-73.142778zM642.559312 132.938098l158.354116 129.097004-158.902687 129.828432A89.965618 89.965618 0 0 0 556.799403 329.143602h-3.657139a585.14223 585.14223 0 0 0-329.142504 108.251312A411.976701 411.976701 0 0 1 255.999726 373.212126c61.07422-103.131318 165.485537-162.742683 310.85681-177.005525a89.051333 89.051333 0 0 0 77.165631-63.268503M589.896511 0.001097a16.457125 16.457125 0 0 0-16.639982 16.457125v91.428474a16.639982 16.639982 0 0 1-14.99427 16.274268c-389.485297 38.399959-438.856673 358.399616-441.233813 509.805168a16.274268 16.274268 0 0 0 16.639982 16.639982 16.091411 16.091411 0 0 0 14.628556-9.325704c73.142779-150.674124 227.839756-230.399753 407.770992-237.714031a16.639982 16.639982 0 0 1 16.457125 16.639982v88.137049a16.639982 16.639982 0 0 0 16.639982 16.639982 16.274268 16.274268 0 0 0 10.239989-3.839996L900.936178 274.286518a16.639982 16.639982 0 0 0 0-25.599973L600.1365 3.841093a15.177127 15.177127 0 0 0-10.239989-3.839996z',
onclick: function (){
                            alert('myToolHandler2')
                        }
                    }
                }
          }

以上是我百度的代码
在本地是没有问题的
但是在VUE项目打包中回出现不显示的问题 ,解决问题的原因也很简单
我们的路径用base64编码格式
如果是图片形式的路径icon为 :image://

 myTool1: {
                    show: true,
                        title: '显示统计图',
                        icon: 'image://../Images/orderedList0.png',
                        onclick: function (){
                            callbackTitleOne();
                        }
                    }

如果是SVG形式的路径icon为 :path://

我们所有的回调操作 都可以在onclick里面写

相关文章

  • Echart 增加自定义下载Excel功能

    在项目中你所遇到的项目需求各个奇葩, 我今天就遇到一个,图片和Excel下载功能还有自定义Icon1.首先Echa...

  • echart启航

    构建简单echart图表:参考:Echart官网 查看官方文档说明 下载echart脚本Echart官方网站 下载...

  • 【免费工具】百度文字识别工具

    百度文字识别工具 v0.0.1 [下载链接] 更新 增加表格识别功能 [图片转excel] 参考教程 [只要10分...

  • Excel 如何自定义功能区?

    自定义功能区是从 Excel 2010 版本开始新加入的功能,此项功能允许用户将 Excel 自带命令添加到已有选...

  • office2010使用小记(1)

    excel表格添加滚动条 打开excel,文件-->选项-->自定义功能区-->勾选开发工具-->excel工具栏...

  • DatistEQ之JsChart节点应用

    JsChart节点,提供一种高度灵活的自定义绘图功能,JsChart需要用户自己编写配置脚本,脚本遵循EChart...

  • python 导入导出文件

    1、最简单的文件下载功能 2、更合理的文件下载功能 3、文件下载功能再次优化 4、直接导出Excel表格 5、导出...

  • django导出数据生成excel并下载到本地

    功能分析:1、生成excel文件;2、将生成的excel文件下载到本地; utils.py文件中完成excel文件...

  • excel VBA

    零. excel 2016 开启VBA “Excel选项”对话框,单击“自定义功能区”选项, 在右侧的面板的列表框...

  • WPS表格比Excel好用100倍的技能

    为照顾国人的使用,WPS表格除了继承Excel表格80%以上的功能外,还增加了在Excel中我们做梦都想实现的功能...

网友评论

      本文标题:Echart 增加自定义下载Excel功能

      本文链接:https://www.haomeiwen.com/subject/dupkiqtx.html