Echart自定义y轴刻度信息2
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
<!-- 引入 echarts.js -->
<script src="echarts.common.min.js"></script>
</head>
<body>
<div id="container" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var app = {};
option = null;
app.title = '坐标轴刻度与标签对齐'; option = {
color: ['#e5b87f'],
tooltip : {
trigger: 'axis',
axisPointer : { // 坐标轴指示器，坐标轴触发有效
type : 'line' // 默认为直线，可选为：'line' | 'shadow'
}
},
grid: {
top: '3%',
left: '0',
right: '0',
bottom: '0',
containLabel: true
},
xAxis : [
{
type : 'category',
data : [1,2,3,4,5], //数据值
axisTick: {
alignWithLabel: true
}
}
],
// yAxis:{},//默认
yAxis: {
axisTick : {show: false},//去掉刻度
splitLine:{ //去掉背景水平网格线
show:false
},
min:0,
max:5,
axisLabel:{
// 自定义y轴刻度信息
formatter: function (value) {
var texts = [];
if(value==0){}
else if(value==1){
texts.push('凶');
}
else if (value ==2) {
texts.push('次凶');
}
else if (value == 3) {
texts.push('吉');
}
else if(value == 4){
texts.push('中吉');
}
else{
texts.push('大吉');
}
return texts;
}
}
},
series : [
{
name:'直接访问',
type:'bar',
barWidth: '45%',
data:[1,2,3,4,5,6,7,8,9,10,11,12] //x轴1到12月份
}
]
};
;
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</body>
</html>
效果图：
Echart自定义y轴刻度信息2的更多相关文章
- Echart自定义y轴刻度信息1
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Winform中自定义添加ZedGraph右键实现设置所有Y轴刻度的上下限
场景 Winforn中实现ZedGraph自定义添加右键菜单项(附源码下载): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10 ...
- Winform中实现ZedGraph新增自定义Y轴上下限、颜色、标题功能
场景 Winform中实现ZedGraph的多条Y轴(附源码下载): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/1001322 ...
- 坐标轴刻度取值算法-基于魔数数组-源于echarts的y轴刻度计算需求
本文链接:https://blog.csdn.net/qq_26909801/article/details/96966372数值型坐标轴刻度计算算法前言算法描述上代码代码运行效果结语前言因实习的公司 ...
- highcharts 不显示X轴 Y轴 刻度
xAxis: { tickWidth:0, //设置刻度标签宽度 lineColor:'#ffffff',//设置坐标颜色 lineWidth:0, //设置坐标宽度 la ...
- 实用小工具不定期合集(textarea 高度自适应、自动计算Y轴刻度、json转table)
1.textarea高度自适应 这个非常有用,但是网上的解决方案都不尽人意,话不多说,上代码. function auto (elem) { var minHeight = 30 var change ...
- Winform中设置多条Y轴时新增的Y轴刻度不显示问题解决
场景 Winform中实现ZedGraph的多条Y轴(附源码下载): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/1001322 ...
- echarts 修改y轴刻度间隔问题
其中min.max可以自定义可以动态获取数据 yAxis : [ { type : 'value', axi ...
- echarts Y轴刻度保留几位小数
yAxis: [ { type: 'value', name: '雨量(mm)', nameLocation: 'start', inverse: true, axisLabel: { ...
随机推荐
- 用java实现一个简易编译器2-语法解析
- MonoBehaviour.print和Debug.Log是同样的作用
MonoBehaviour.print("identical------------------------");
- 修改 cmd 控制台字体、巧用 FontLink 使中英文独立设置
众所周知,Windows 中 cmd 控制台窗口的字体难看,但是修改注册表是可以实现修改其字体的,但很多很棒的编程字体是没有中文的,所以在显示中文时直接调用了宋体,这绝妙的反差实在是 不忍直视.但是, ...
- java.util.regex.PatternSyntaxException, dangling metacharacter “?” 解决方法
今天在用正则表达式的时候遇到这样一个异常 看了相关资料后发现这是因为在正则表达式中,像"?","*","\"都是保留字符,所以在用的时候需要 ...
- tomcat使用log4j管理日志
1.JDK+tomcat环境 参考:http://www.cnblogs.com/zzzhfo/p/6444029.html 2.下载相关软件 log4j下载地址 http://www.apache ...
- LIS和LCS LCIS
首先介绍一下LIS和LCS的DP解法O(N^2) LCS:两个有序序列a和b,求他们公共子序列的最大长度 我们定义一个数组DP[i][j],表示的是a的前i项和b的前j项的最大公共子序列的长度,那么由 ...
- Python爬虫实战一之爬取糗事百科段子
大家好,前面入门已经说了那么多基础知识了,下面我们做几个实战项目来挑战一下吧.那么这次为大家带来,Python爬取糗事百科的小段子的例子. 首先,糗事百科大家都听说过吧?糗友们发的搞笑的段子一抓一大把 ...
- 修改字段注释modify
alter table test1 modify 字段名 类型 comment '修改后的字段注释'; ALTER TABLE tc_activity_miaosha MODIFY `validity ...
- 掌握所有IO口的外部中断
外部中断配置流程 1.初始化IO口工作在普通IO.上拉输入状态. 2.首先开IO口组中断(P0IE=1.P1IE=1.P2IE=1): 3.开组内对应的具体某IO口中断(P0IEN.P1IEN.P2I ...
- 【Django】Django Debug Toolbar调试工具配置
正在发愁怎么调试Django,就遇到了Django Debug Toolbar这个利器. 先说遇到的问题: 网上也有教程,不过五花八门的,挨个尝试了一遍,也没有成功运行.最后终于找到问题所在: 从开发 ...