echarts 显示下载按钮,echarts 自定义按钮,echarts 添加按钮

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

©Copyright  蕃薯耀 2017年2月8日 星期三

http://www.cnblogs.com/fanshuyao/

一、echarts内置按钮

echarts按钮在工具栏。

内置有导出图片,数据视图,动态类型切换,数据区域缩放,重置五个工具。如下图所示:

按钮的配置在toolbox下的feature属性

http://echarts.baidu.com/option.html#toolbox

1、保存为图片:saveAsImage

文档见:http://echarts.baidu.com/option.html#toolbox.feature.saveAsImage

2、数据视图工具,可以展现当前图表所用的数据,编辑后可以动态更新:dataView

文档见:http://echarts.baidu.com/option.html#toolbox.feature.dataView

其它的不再说了,自己到官网看文档

下面的代码显示下载图片按钮及数据视图按钮:

  1. toolbox: {
  2. //show: true,
  3. itemSize: 20,
  4. itemGap: 30,
  5. right: 50,
  6. feature: {
  7. dataView: {show:true},
  8. saveAsImage: {
  9. //excludeComponents :['toolbox'],
  10. pixelRatio: 2
  11. }
  12. }
  13. }

二、echarts自定义按钮

除了各个内置的工具按钮外,还可以自定义工具按钮。

注意,自定义的工具名字,只能以 my 开头,例如下例中的 myTool1,myTool2:

  1. {
  2. toolbox: {
  3. feature: {
  4. myTool1: {
  5. show: true,
  6. title: '自定义扩展方法1',
  7. icon: 'image://http://echarts.baidu.com/images/favicon.png',
  8. onclick: function (){
  9. alert('myToolHandler1')
  10. }
  11. },
  12. myTool2: {
  13. show: true,
  14. title: '自定义扩展方法',
  15. icon: 'image://http://echarts.baidu.com/images/favicon.png',
  16. onclick: function (){
  17. alert('myToolHandler2')
  18. }
  19. }
  20. }
  21. }
  22. }

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

©Copyright  蕃薯耀 2017年2月8日 星期三

http://www.cnblogs.com/fanshuyao/

echarts 显示下载按钮,echarts 自定义按钮,echarts 添加按钮的更多相关文章

  1. ECharts概念学习系列之ECharts官网教程之自定义构建 ECharts(图文详解)

    不多说,直接上干货! 官网 http://echarts.baidu.com/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%2 ...

  2. iOS tableview自定义cell上添加按钮实现删除功能

    在删除的时候,先删除数据源,再删除cell 但是,会发现一直崩: numberOfRowsInSection 解决方案:

  3. 通过store为toolbar添加按钮

    目的是实现导航条toolbar可以动态加载按钮. ExtJS的版本是4.0. 实现方案有两个.方案一:添加render事件监听,在监听事件处理函数中使用Ext.Ajax获取按钮信息,实现动态添加按钮. ...

  4. C#曲线分析平台的制作(三,三层构架+echarts显示)

    本文依据CSDN另一位网友关于三层构架的简单搭建,基于他的源码进行修改.实现了三层构架合理结构,以及从数据库中传递数值在echarts显示的实验目的. 废话不多说,show me codes: 具体构 ...

  5. python 全栈开发,Day114(装饰器,排序规则,显示列,添加按钮,定制ModelForm,自定义列表页面,自定制URL)

    一.装饰器 装饰器本质上就是一个python函数,他可以让其他函数在不需要做任何代码变动的前提下,增加额外的功能,装饰器的返回值也是一个函数对象. 装饰器的应用场景:比如插入日志,性能测试,事务处理, ...

  6. 制作自定义背景Button按钮、自定义形状Button的全攻略(转)

    在Android开发应用中,默认的Button是由系统渲染和管理大小的.而我们看到的成功的移动应用,都是有着酷炫的外观和使用体验的.因此,我们在开发产品的时候,需要对默认按钮进行美化.在本篇里,笔者结 ...

  7. 【转】自定义iOS的Back按钮(backBarButtonItem)和pop交互手势(interactivepopgesturerecognizer) --- 不错

    原文网址:http://blog.csdn.net/joonsheng/article/details/41362499 序 说到自定义UINavigetionController的返回按钮,iOS7 ...

  8. stark组件开发之添加按钮显示和URL

    添加: 需求: 根据用户的权限, 决定是否,有添加按钮.  通过配置进行定制,预留钩子进行权限的判断. class StartHandler(object): .................... ...

  9. C#自定义按钮、自定义WinForm无边框窗体、自定义MessageBox窗体

    C#自定义按钮.自定义WinForm无边框窗体.自定义MessageBox窗体 C#自定义Button按钮控件 效果展示 C#自定义Winform无边框窗体 效果展示 C#自定义无边框MessageB ...

随机推荐

  1. CodeForces 617E XOR and Favorite Number

    莫队算法. #include<cstdio> #include<cmath> #include<cstring> #include<algorithm> ...

  2. seajs的常用api简易文档

    目前使用sea.js的公司越来越多, 比如朋友网,阿里巴巴,淘宝网,百姓网,支付宝,有道云笔记等.模块化的javascript开发带来了可维护,可扩展性,尤其在多人协作开发的时候不用再担心文件依赖和函 ...

  3. 控制流(swift)

    检测API是否可用 if #available(iOS 9, OSX 10.10, *) { // 在 iOS 使用 iOS 9 APIs , 并且在 OS X 使用 OS X v10.10 APIs ...

  4. iOS开发者需要的5款排版工具

    Attributed String Creator Attributed String Creator可以从你的格式化文本中自动生成原生的Objective-C代码.你可以将文本写入.粘贴或者导入At ...

  5. Spring自学教程-IOC、DI、AOP(二)

    一.spring的IOC-就是怎样使用spring来创建对象 二.springDI(依赖注入)-就是怎样给属性赋值 通过set方式赋值 以下我们只需要记住两点的赋值,基本类型和引用类型的赋值 基本类型 ...

  6. (简单) HDU 3308 LCIS,线段树+区间合并。

    Problem Description Given n integers. You have two operations: U A B: replace the Ath number by B. ( ...

  7. 在JSP里使用CKEditor和CKFinder

    在JSP里使用CKEditor和CKFinder 最 近在做一个新闻发布平台,放弃了很早的FCKEditor,使用CKEditor和CKFinder,尽管免费的CKFinder是Demo版本,但是功 ...

  8. iOS UICollectionView 长按移动cell

    ref:http://www.jianshu.com/p/31d07bf32d62 iOS 9之后: 示例如下 效果 前言: 看完你可以学到哪些呢? 就是文章标题那么多, 只有那么多. . 手残效果图 ...

  9. c#中反射

    在.Net 中,程序集(Assembly)中保存了元数据(MetaData)信息,因此就可以通过分析元数据来获取程序集中的内容,比如类,方法,属性等,这大大方便了在运行时去动态创建实例. MSDN解释 ...

  10. 3)Javascript设计模式:Observer模式

    Observer模式 var Observer = (function() { var instance = null; function Observe() { this.events = {} } ...