常用,待续...

♣tooltip自动轮播


♣ 实现数据自动轮播

原理:其实就是timeline,获取某几段(时间)的数据,然后隐藏timeline


♣ legend自动轮播


♣ 左侧多字出省略号

formatter:  (item, index) =>{
let icon = item.length > 5 ? item.substring(0, 5) + '...' : item;
}

♣ 自定义lengend

利用rich


♣ 获取多个数据最大值

// 所有数据最大值
let itemData = [784, 6854, 58, 365];
let maxValue = Math.max.apply(null, itemData);

♣ 对象按某个字段降序

chartData.sort((a, b) => {
return a.value - b.value
})

♣ 给pie加复杂背景图

给pie加复杂背景图,并且浏览器resize不会变形

最简单最粗暴的方法,是给父div加背景图

.circle1 {
background: url("~assets/images/pieBg2.png") 0 0 / 100% 100% no-repeat;
background-size: contain;
background-position: center;
}

  

这篇文章,css处理方法也非常赞

http://zihua.li/2013/12/keep-height-relevant-to-width-using-css/

echarts高级的更多相关文章

  1. ECharts一个强大的商业产品图表库

    Architecture ECharts (Enterprise Charts 商业产品图表库) 提供商业产品常用图表库,底层基于ZRender,创建了坐标系,图例,提示,工具箱等基础组件,并在此上构 ...

  2. 开源来自百度商业前端数据可视化团队的超漂亮动态图表--ECharts

    开源来自百度商业前端数据可视化团队的超漂亮动态图表--ECharts 本人项目中最近有需要图表的地方,偶然发现一款超级漂亮的动态图标js图表控件,分享给大家,觉得好用的就看一下.更多更漂亮的演示大家可 ...

  3. react native中使用echarts

    开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...

  4. Vue如何使用动态刷新Echarts组件

    这次给大家带来Vue如何使用动态刷新Echarts组件,Vue使用动态刷新Echarts组件的注意事项有哪些,下面就是实战案例,一起来看一下. 需求背景:dashboard作为目前企业中后台产品的“门 ...

  5. 开源的数据可视化JavaScript图表库:ECharts

    ECharts (Enterprise Charts 商业产品图表库)是基于HTML5 Canvas的一个纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.创新的拖拽 ...

  6. 【推荐】开源来自百度商业前端数据可视化团队的超漂亮动态图表--ECharts

    本人项目中最近有需要图表的地方,偶然发现一款超级漂亮的动态图标js图表控件,分享给大家,觉得好用的就看一下.更多更漂亮的演示大家可以参考下面两个网址:ECharts官方网址:http://ecomfe ...

  7. 图表制作工具之ECharts

    简介 ECharts,缩写来自Enterprise Charts,商业级数据图表,一个纯Javascript的图表库,可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器(IE6/7/8/9/10 ...

  8. 流量分析系统----讲解-echarts模拟迁移(结合china.js)

    百度 Echarts 地图->模拟迁徙,实现自动切换地图 小航哥注释: 1.本文主要是把模拟迁移的流程讲了一遍,讲的很好.具体实现参考航哥这篇随笔“流量分析系统----实现-echarts模拟迁 ...

  9. echarts学习笔记(部分angular及ant-design)

    1.在项目中修改ng-zorro组件默认样式的一些方法: 类名等 前加::ng-deep: 类名等 前加:root: 类名等 前加:host /deep/: 2.echarts横轴自定义时间粒度 两种 ...

随机推荐

  1. .net与C#

    一..net包含什么? 1.包含庞大的代码库,分为多个模块,可以自主选择 2.定义了基本的类型,被称为通用类型系统(CTS,common type system): 3.包含.NET公共语言运行库(C ...

  2. 2018湘潭大学程序设计竞赛【C】

    题目链接:https://www.nowcoder.com/acm/contest/105/C 题意:给你几个矩形的左上角和右下角的坐标,让你算有几个矩形相交. 题解: 每次都暴力标记一下炸弹区域里的 ...

  3. Shiro学习笔记1 —— Hello World

    1.创建一个Maven工程加载Shiro的jar包 <!-- junit --> <dependency> <groupId>junit</groupId&g ...

  4. arm-linux-readelf 的使用

    1. 读 elf 文件开始的文件头部 [arm@localhost gcc]$ arm­linux­readelf ­h hello ELF Header: Magic:   7f 45 4c 46 ...

  5. SUBTRACT

    SUBTRACT 给出一个长度为n序列\(\{a_i\}\),定义一个操作,记做\(con(a,i)\),意思是用\(a_i-a_{i+1}\)替代\(a_i,a_{i+1}\),显然最后一个数字不能 ...

  6. Cats Transport

    Cats Transport 现在有n座山,第i座山的坐标为\(d_i\),初始p个饲养员在山1,有m只猫,每只猫有一个属性\(h_i,t_i\)表示猫i 在\(h_i\)以及它在\(t_i\)时间后 ...

  7. 树莓派3b+ 实现视频监控

    设备:树莓派3B+.Raspberry Pi Camera sudo raspi-config #启动camera sudo reboot #监测摄像头是否安装成功 raspistill -o ima ...

  8. php 三种文件下载的实现

    第一种:直接添加文件下载的绝对路径连接 //如:我有一个文件在demo.xx.cn/demo.zip <button> <a href = "http://demo.xx. ...

  9. 「题解」:$d$

    问题 A: $d$ 时间限制: 1 Sec  内存限制: 512 MB 题面 题面谢绝公开. 题解 赛时切掉了然而过程十分曲折. 贪心思路很好想.然而一开始错误以为是单峰.其实几个峰都有可能. 开场写 ...

  10. tornado接收ajax的post请求报错WARNING:tornado.access:405 OPTIONS /add

    后端报错信息 WARNING:tornado.access:405 OPTIONS /add (::1) 1.00m 前端报错信息 2xhr.js?ec6c:172 OPTIONS http://lo ...