echart的x换行
option = {
legend: {
y: 'bottom',
data:['该业务正常类比例','该业务关注类比例','该业务不良类比例']
},
xAxis: {
type: 'category',
data: ['xx', 'xx', 'xxxxx', 'xxxxxx', 'xxxxxx', 'xxxxxxxxx'], //替换 //换行部分。。。。。
axisLabel:{
interval:0,
formatter:function(value){
var ret = '';
var maxLength = 4;
var rowNum = Math.ceil(value.length/maxLength);
if(rowNum > 1) {
for(var i = 0; i < rowNum; i++) {
var temp ="";
var start = i * maxLength;
var end = start + maxLength;
temp = value.substring(start,end) + "\n";
ret += temp;
}
return ret;
}else {
return value;
}
}
}
},
yAxis: [
{
name: '关注及损失',
type: 'value',
interval:1,
position:'left'
},
{
name: '正常',
type:'value',
interval:20,
position:'right'
}, ],
series: [
{
name:'该业务正常类比例',
data: [2, 3, 3, 1, 2, 4], //替换
type: 'bar'
},
{
name:'该业务关注类比例',
data: [1, 2, 3, 4, 5, 6], //替换
type: 'bar'
},
{
name:'该业务不良类比例',
data: [99, 97, 97, 97, 97, 97],//替换
yAxisIndex:1,
type: 'line'
} ]
};
图:
echart的x换行的更多相关文章
- echart的tooltip自定义换行
自定义换行,内容很长的时候 tooltip : { trigger: 'axis', axisPointer : { // 坐标轴指示器,坐标轴触发有效 type : 'shadow' // 默认为直 ...
- echart的x轴换行
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- echart纵坐标标签特别长换行显示
纵坐标 yAxis : [ { type : 'category', data : name, axisLabel: { //坐标轴刻度标签的相关设置. textStyle: { color: '#0 ...
- echart.js的使用与API
---恢复内容开始--- echart.js的使用与API 1.echart.js的使用: 第一步:在head标签或body下创建一个script标签去引用echart.js,(该文件可以在echar ...
- echart使用总结
以下参数都是写在option配置对象内,没有提及的配置参数欢迎查阅读echart参考手册. 一. 修改主标题和副标题 title : { text: '未来一周气温变化',//写入主标题 subtex ...
- 图表库 - Highchart / Echart
当前主要使用HighChart和Echart图表库,都基于Jquery,需要先引用Jquery. 实际问题:引入Jquery需在图表库前,否则报错. HighChart官网:https://www.h ...
- echart 库 初始
一.echart简介 Echarts (http://echarts.baidu.com/)是百度公司出品的,算是百度不可多得的良心之作.要彻底掌握Echarts,你需要掌握一点前端开发的知识,这些知 ...
- SQL:指定名称查不到数据的衍伸~空格 换行符 回车符的批量处理
异常处理汇总-数据库系列 http://www.cnblogs.com/dunitian/p/4522990.html 先看看啥情况 复制查询到的数据,粘贴一下看看啥情况 那就批量处理一下~ 就这样 ...
- EChart系列:在echart3中使用百度地图扩展之后,如何获取到百度地图对象
最近做项目想要在百度地图上叠加显示echart的散点图,然后根据地图的缩放等级和区域范围要显示不同的散点图,这中间折腾了好久.功能要求包括: (1)底图使用百度地图: (2)可以在地图上叠加显示ech ...
随机推荐
- python学习:注释、获取用户输入、字符串拼接、运算符、表达式
注释 #为单行注释'''三个单引号(或者"""三个双引号)为多行注释,例如'''被注释的内容''' '''三个单引号还可以起到多行打印的功能. #ctrl+? 选中的多行 ...
- ECMA Script 6_数组的扩展_扩展运算符
1. 扩展运算符 内部调用的是数据结构的 Iterator 接口, 因此只要具有 Iterator 接口的对象,都可以使用扩展运算符 ... 如 map,,,, [...arr] 扩展运算符(spre ...
- MYSQL 导入导出数据库文件
一.从数据库导出数据库或表文件: mysqldump -u用戶名 -p密码 -d 数据库名 表名 > 脚本名; 导出整个数据库结构和数据mysqldump -h localhost -uroot ...
- 测试自动化学习3-python3简单操作
1.列表操作 增 stu = []stus.append('lili') #在list的末尾增加一个元素 stus.insert(9,'yjk') #在指定的位置插入元素, 查 print('单个取, ...
- 动态规划 hdu 1024
Max Sum Plus Plus Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others ...
- Windows 主机名映射地址
在开发中大数据集群中我们自己的电脑主机名映射不到集群的主机名下面我们就去修改自己电脑 主机名映射地址 c/Windows/System32/drivers/etc/host 文件将主机名和IP地址 ...
- Multi-Projector Based Display Code ---- FAQ
Frequently Asked Question How do I know that my camera has a proper lens? Answer: If you can see exa ...
- VUE错误码Attribute ':sizeOpts' must be hyphenated
Attribute ':sizeOpts' must be hyphenated 因为属性有大写,需要添加 - 来取代 例如 tampData 换成 tamp-data 就可以了
- 对不可描述的软件安装sfbo插件
0 后来...突然有一天,我就需要sfbo了. 1 安装 yum search "不可描述插件"是空的,只能用源码安装. 官方信息可以链接到这里,obfs. 1.1 编译安装 gi ...
- 一、使用官方工具建立空springboot
自己搭过springboot,看的官网,一点点自己弄,集成druid,做了些例子,从0到1弄了一下午. 当时没看到有工具可用,可以把依赖都加上,简称STS. 下载地址: htt ...