ehcarts之toolbox,工具栏

toolbox

工具栏。内置有导出图片数据视图动态类型切换数据区域缩放重置五个工具。

feature各工具配置项。具体显示功能

1、saveAsImage 保存为图片。

2、restore 还原

3、dataView 数据视图

4、dataZoom 缩放视图

5、magicType 动态类型切换

代码如下:

toolbox:{
feature:{
  saveAsImage:{
    show:true
  },
  restore:{
    show:true
  },
  dataView:{
    show:true
  },
  dataZoom:{
    show:true
  },
  magicType:{
    type:[‘line‘,‘bar‘]
    }
  }
},

1、dataView

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

如将衬衫改为20,点击右下角刷新,可看到改变的数据,但这不会改变本质数据,数据库数据还是原先设置的,通过还原,和刷新都会回到最初数据。

2、dataZoom

数据区域缩放。目前只支持直角坐标系的缩放。

可以具体放大某个区域,只需要在区域内画个框,如不满足观看,可继续画框放大。可通过区域缩放还原和restore都可回的最初的设置,

如放大“羊毛衫、雪纺衫、裤子、高跟鞋”

3、restore

配置项还原。

如上面的dataView、dataZoom设置的内容,点击这个还原,就回到最初的设置。

时间: 2024-10-24 08:44:18

ehcarts之toolbox,工具栏的相关文章

Excel开发学习笔记:界面交互与控件的布局

除了业务逻辑之外,比较耗时耗力的就是人机交互了.在编写excel定制程序的过程中,这次用到了以下几种交互方式: 通过excel工作表(worksheet)获取用户输入 通过按钮控件触发功能代码执行 通过TreeView控件显示内容摘要及导航 通过自定义的windows窗体提供交互 工作表的操作放到后面再说,讲一下按钮控件button和Treeview控件的布局. 放置控件的方法: 无非可视化放置和运行时代码加载两种.可视化放置比较直观,通过visual studio的toolbox工具栏拖动需要

Echarts-2.2.7中统计出来的统计图保存为图片

今天在做一个图形报表,有个需求是要把展现的统计图保存为图片, 图形报表用的Echarts-2.2.7, 以前有用过 Echarts,记得echarts插件是可以帮助我们把统计图保存为图片的. 只是不记得是怎么配置了,查看API文档很久也没有找到,最后在 文档/配置项手册 里面找到了配置方法 和配置 参数. 下图是 Echarts官网 实例中的配置: 下面来说说配置保存图片的步骤: 1.保存图片是Echarts的一个工具,先找到工具箱 toolbox 工具栏.内置有导出图片,数据视图,动态类型切换

深入浅出ECharts系列 (二) 折线图

深入浅出ECharts系列(二) 目标 本次教程的目标是实现“折线图堆叠”折线,实现结果如图: 2. 准备工作 a)         首先下载ECharts插件,你可以根据自己的实际需求选择你想要下载的版本,也可以自己定制相应功能的版本,下面附上插件的下载地址: http://echarts.baidu.com/download.html 我们下载完整版为大家进行演示. 3. 正式开始 首先,我新建了一个MVC4项目,将下载的文件放到对应的位置: 然后新建一个控制器和对应的视图,添加对文件的引用

echarts_部分图表配置_堆叠折线图

echarts基本图表使用: 1.获取包裹元素(var myChart = echarts.init(document.getElementById('thisId'));)2.设置option(option={...})3.使用设置好的option显示图表(myChart.setOption(option);) 废话不多讲上图: function ZX_bottom (thisId,titleName){ var myChart = echarts.init(document.getEleme

poll?transport=longpoll&connection...烦人的请求

2016-06-19 11:50 76人阅读 评论(0) 收藏 举报  分类: C#那点事 版权声明:本文为博主原创文章,未经博主允许不得转载. 1.问题描述: 最近使用miniui做了一个后台管理系统,打开浏览器调试时,总发现一堆无关的请求,结构大致是:poll?transport=longpoll&connection.....一直不停的刷,看着很烦人.起初以为这是miniui的数据请求没处理好,网上了解之后,才发现这是VS 2013的 Browser Link 功能. 2.Browser

Echart输出图形

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getS

Vue使用Echarts以及Echarts配置分享

一.本篇文章将给大家分享如何在vue中使用echart以及echart各项配置,这些配置都是工作中比较常见以及常用到的,所以给大家分享下,希望对大家有用. 二.vue中使用echart. 1.首先下载echart依赖,这里采用的npm包管理工具,在项目中运行命令: npm install echarts --save-dev 2.在main.js里引入echart: import echarts from 'echarts'; 3.在vue中注册echart: Vue.prototype.$ec

echarts 点击方法总结,点任意一点获取点击数据,举例说明:在多图联动中点击绘制标线

关于点击(包括左击,双击,右击等)echarts图形任意一点,获取相关的图形数据,尤其是多图,我想部分人遇到这个问题一直很头大.下面我用举例说明,如何在多图联动基础上,我们点击任意一个图上任意一点,在点击处绘制一条标注线.多图联动的用法,我就不详细解释,不明白或者感兴趣的同学可以看我上一篇:http://www.cnblogs.com/mobeisanghai/p/7683158.html ,虽然最近很忙,很久没更新,但是基本清晰.关于引入样式和js,以及初始元素如下: <script src=

使用Echarts几分钟制作出折线图、饼图、柱状图等

ECharts,缩写来自Enterprise Charts. ECharts,不仅是国内关注度最高的开源项目,还是中国第一个也是目前唯一一个入选了Github Explorer Data Visualization板块的开源项目.这里咱们结合上篇提到的Bootstrap简单栅格框架,来做一个小小的布局.学以致用嘛.从来不喜欢赘述,直接上代码,一切的解释,请看代码注释: <script type="text/javascript" src="js/jquery.min.j