常用,待续...

♣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. CSS3教程:Responsive框架常见的Media Queries片段

    CSS3 Media Queries片段在这里主要分成三类:移动端.PC端以及一些常见的响应式框架的Media Queries片段.移动端Media Queries片段iPhone5@media sc ...

  2. 【图论】tarjan

    刚接触tarjan,tarjan其实更多是用来找强联通分量.我这里呢,是看qsc的视频学的.卿学姐讲的其实很清楚啦. 我这里只是做个整理. low[]:表示能到达这个点的最小编号.[树枝边].啊,其实 ...

  3. css元素垂直居中

    一.碎碎念:啊啊啊,原谅我只能起一个酱紫微大众微俗气的标题,因为实在没有什么能比这样表达的更清楚直观了呢! 二.没有知识储备,直接上示例: 1.思路:给父元素添加display: table属性:给子 ...

  4. COGS2356 【HZOI2015】有标号的DAG计数 IV

    题面 题目描述 给定一正整数n,对n个点有标号的有向无环图进行计数. 这里加一个限制:此图必须是弱连通图. 输出答案mod 998244353的结果 输入格式 一个正整数n. 输出格式 一个数,表示答 ...

  5. Python自学:第四章 在for循环中执行更多操作(1)

    # -*- coding: GBK -*- magicians = ['alice', 'david', 'carolina'] for magician in magicians: print(ma ...

  6. 0919CSP-S模拟测试赛后总结

    60分-rank36,不出所料又炸了. 总是试图稳住成绩,但就是不能避免这样的大起伏.这样不行啊. T1可是道sb题啊……对着题干yy了一个多小时,正解基本都想到了,只差一个结构体排序. 然而即使我真 ...

  7. 暴力剪枝——cf1181C

    暴力求长度为len时,以i,j为左上角的旗子的数量 不剪枝的话复杂度是n*n*m*n,必定超时 两个可以剪枝的地方:如果格子[i,j]可以作为长度为len的旗子的左上角,那么其必定不可以作为长度> ...

  8. 线性dp——cf1096D

    dp[i][j]表示到第i位,与hard的匹配状态到达了第j位 每位有两种决策:消或者不消 分别转移一下即可 转移代码 ;i<n;++i) ;j<=;++j) { cmin(f[i+][j ...

  9. 获取硬件信息的delphi源码CPUID、操作系统、Mac物理地址、计算机名称、IP地址、用户名

    {-----------------------------------------------------------------------------作者:sushengmiyan 2013.0 ...

  10. SQLite3与C++的结合应用

    SQLite并没有一次性做到位,只有下载这些东西是不能放在vs2010中并马上使用的,下载下来的文件中有sqlite3.c/h/dll/def,还是不够用的.我们需要的sqlite3.lib文件并不在 ...