option = {
tooltip : {
trigger: 'axis'
},
legend: {
data:['最高','最低']
},
toolbox: {
show : true,
orient: 'horizontal', // 布局方式,默认为水平布局,可选为:
// 'horizontal' ¦ 'vertical'
x: 'right', // 水平安放位置,默认为全图右对齐,可选为:
// 'center' ¦ 'left' ¦ 'right'
// ¦ {number}(x坐标,单位px)
y: 'top', // 垂直安放位置,默认为全图顶端,可选为:
// 'top' ¦ 'bottom' ¦ 'center'
// ¦ {number}(y坐标,单位px)
color : ['#1e90ff','#22bb22','#4b0082','#d2691e'],
backgroundColor: 'rgba(0,0,0,0)', // 工具箱背景颜色
borderColor: '#ccc', // 工具箱边框颜色
borderWidth: , // 工具箱边框线宽,单位px,默认为0(无边框)
padding: , // 工具箱内边距,单位px,默认各方向内边距为5,
showTitle: true,
feature : {
mark : {
show : true,
title : {
mark : '辅助线-开关',
markUndo : '辅助线-删除',
markClear : '辅助线-清空'
},
lineStyle : {
width : ,
color : '#1e90ff',
type : 'dashed'
}
},
dataZoom : {
show : true,
title : {
dataZoom : '区域缩放',
dataZoomReset : '区域缩放-后退'
}
},
dataView : {
show : true,
title : '数据视图',
readOnly: true,
lang : ['数据视图', '关闭', '刷新'],
optionToContent: function(opt) {
var axisData = opt.xAxis[].data;
var series = opt.series;
var table = '<table style="width:100%;text-align:center"><tbody><tr>'
+ '<td>时间</td>'
+ '<td>' + series[].name + '</td>'
+ '<td>' + series[].name + '</td>'
+ '</tr>';
for (var i = , l = axisData.length; i < l; i++) {
table += '<tr>'
+ '<td>' + axisData[i] + '</td>'
+ '<td>' + series[].data[i] + '</td>'
+ '<td>' + series[].data[i] + '</td>'
+ '</tr>';
}
table += '</tbody></table>';
return table;
}
},
magicType: {
show : true,
title : {
line : '动态类型切换-折线图',
bar : '动态类型切换-柱形图',
stack : '动态类型切换-堆积',
tiled : '动态类型切换-平铺'
},
type : ['line', 'bar', 'stack', 'tiled']
},
restore : {
show : true,
title : '还原',
color : 'black'
},
saveAsImage : {
show : true,
title : '保存为图片',
type : 'jpeg',
lang : ['点击本地保存']
},
myTool : {
show : true,
title : '自定义扩展方法',
icon : 'image://../asset/ico/favicon.png',
onclick : function (){
alert('myToolHandler')
}
}
}
},
calculable : true,
dataZoom : {
show : true,
realtime : true,
start : ,
end :
},
xAxis : [
{
type : 'category',
boundaryGap : false,
data : function (){
var list = [];
for (var i = ; i <= ; i++) {
list.push('2013-03-' + i);
}
return list;
}()
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
name:'最高',
type:'line',
data:function (){
var list = [];
for (var i = ; i <= ; i++) {
list.push(Math.round(Math.random()* ));
}
return list;
}()
},
{
name:'最低',
type:'line',
data:function (){
var list = [];
for (var i = ; i <= ; i++) {
list.push(Math.round(Math.random()* ));
}
return list;
}()
}
]
};

http://echarts.baidu.com/echarts2/doc/example/toolbox.html

dataView 工具栏的更多相关文章

  1. ECharts学习(3)--toolbox(工具栏)

    1. toolbox:这是ECharts中的工具栏.内置有导出图片.数据视图.动态类型切换.数据区域缩放.重置五个工具. 2. toolbox中的属性,不包含五个工具.里面最主要的就是feature这 ...

  2. [转载]ExtJs4 笔记(12) Ext.toolbar.Toolbar 工具栏、Ext.toolbar.Paging 分页栏、Ext.ux.statusbar.StatusBar 状态栏

    作者:李盼(Lipan)出处:[Lipan] (http://www.cnblogs.com/lipan/)版权声明:本文的版权归作者与博客园共有.转载时须注明本文的详细链接,否则作者将保留追究其法律 ...

  3. ExtJs4 笔记(12) Ext.toolbar.Toolbar 工具栏、Ext.toolbar.Paging 分页栏、Ext.ux.statusbar.StatusBar 状态栏

    本篇讲解三个工具栏控件.其中Ext.toolbar.Toolbar可以用来放置一些工具类操控按钮和菜单,Ext.toolbar.Paging专门用来控制数据集的分页展示,Ext.ux.statusba ...

  4. ECharts学习(1)--toolbox(工具栏)

    1. toolbox:这是ECharts中的工具栏.内置有导出图片.数据视图.动态类型切换.数据区域缩放.重置五个工具. 2. toolbox中的属性,不包含五个工具.里面最主要的就是feature这 ...

  5. ehcarts之toolbox,工具栏

    toolbox 工具栏.内置有导出图片,数据视图,动态类型切换,数据区域缩放,重置五个工具. feature各工具配置项.具体显示功能 1.saveAsImage 保存为图片. 2.restore 还 ...

  6. ASP.NET Aries 入门开发教程5:自定义列表页工具栏区

    前言: 抓紧时间,继续写教程,因为发现用户期待的内容,都在业务处理那一块. 不得不继续勤劳了. 这节主要介绍工具栏区的玩法. 工具栏的默认介绍: 工具栏默认包括5个按钮,根据不同的权限决定显示: 添加 ...

  7. 吸顶大法 -- UWP中的工具栏吸顶的实现方式之一

    如果一个页面中有很长的列表/内容,很多应用都会在用户向下滚动时隐藏页面的头,给用户留出更多的阅读空间,同时提供一个方便的吸顶工具栏,比如淘宝中的店铺页面. 下面是一个比较简单的实现,如果有同学有更好的 ...

  8. 基于 SailingEase WinForm Framework 开发客户端程序(3:实现菜单/工具栏按钮的解耦及状态控制)

    本系列文章将详细阐述客户端应用程序的设计理念,实现方法. 本系列文章以  SailingEase WinForm Framework 为基础进行设计并实现,但其中的设计理念及方法,亦适用于任何类型的客 ...

  9. arcgis api for js入门开发系列三地图工具栏(含源代码)

    上一篇实现了demo的地图加载展示,在上篇实现的基础上,新增了地图工具栏以及通用地图控件功能,比如地图框选缩放.地图漫游.清空.量算工具.地图导航控件.地图比例尺控件.地图鹰眼图等等,总共分为5个部分 ...

随机推荐

  1. 对拷 使用scp命令在两台linux上对拷文件或者文件夹

    以前一直是在服务器上tar打包压缩,下载到本地电脑上,再上传到另外一台服务器上,再解压. 其实使用scp命令就可以直接对拷文件或者文件夹了. scp就是secure copy,是用来进行远程文件拷贝的 ...

  2. C#与C++之间类型对应关系

    //C++中的DLL函数原型为  //extern "C" __declspec(dllexport) bool 方法名一(const char* 变量名1, unsigned c ...

  3. 谷歌SEO老域名注册完全攻略

    老域名有优势,不管在百度和谷歌都是一样的. 我们查看搜索结果就能发现,谷歌里面很多排前十的网站都是N年前的,一零年以后的算是比较新的,很多产品网站域名是零几年,甚至很多排名更好的域名是九几年的. 谷歌 ...

  4. c语言字符处理函数常见使用集合

    1.最近看一些开源项目代码时,总会看到 c 语言中一些  "str" 开头的处理字符串的用法,有的之前没用到过,特此记录,随时看到随时添加. 这里不提出源码,只是一些使用说明加例子 ...

  5. Search insert position, 查找插入位置

    问题描述:给定一个有序序列,如果找到target,返回下标,如果找不到,返回插入位置. 算法分析:依旧利用二分查找算法. public int searchInsert(int[] nums, int ...

  6. python学习笔记(pict+subprocess)

    这几天看到接口自动化用例的生成,关于这里博主自己也想了想,是否可以根据参数的范围自动生成用例,这样就不用一条一条的写接口测试用例 这里就设计到用例设计的方法,让我想到之前接触过一款微软的用例自动生成工 ...

  7. yii2:多条件多where条件下碰到between时,between语句如何处理呢?

    yii2:多条件多where条件下碰到between时,between语句如何处理呢? 我有一张表:id,name,telphone,ticket_no,status,create_time等字段, ...

  8. DDOS 攻击工具

    DDOS  攻击工具 使用github上的DDOS攻击工具 https://github.com/Ha3MrX/DDos-Attack 将python脚本拷贝到主机,使用 chmod +x ddos- ...

  9. Win7 SP1 下安装 VS2015 Update 3

    首先Win7必须是SP1,然后要求安装IE11,安装IE11前需要安装6个先决补丁,成功安装IE11后建议安装3个可选补丁.然后导入3个根证书(COMODO RSA Certification Aut ...

  10. mongodb之一些简单的增删改查语句

    数据库操作:show dbs;#查看数据库use test;#如果没有就创建一个db;#查看当前数据库db.dropDatabase();#删除数据库 数据操作:show collections:#查 ...