echarts坐标轴线、坐标轴刻度线、网格线控制显示隐藏以及柱状图颜色设置
x轴设置如下、y轴同理
xAxis: {
name: ' ',
axisTick: {
show: true //坐标轴刻度线
},
axisLine: { //轴线
show: false
},
splitLine:{ //网格线
show:true
},
axisLabel: { //坐标轴样式
textStyle: {
color: '#636363'
}
}},
效果图:-------》》

顺便来一下,柱状图颜色设置
series: [
{
type: 'bar',
encode: {
// Map the "amount" column to X axis.
x: 'amount',
// Map the "product" column to Y axis
y: 'product'
},
itemStyle: {
normal: {
//这里是重点
color: function(params) {
//注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
var colorList = ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83', '#ca8622'];
return colorList[params.dataIndex]
}
}
}
}
]
echarts坐标轴线、坐标轴刻度线、网格线控制显示隐藏以及柱状图颜色设置的更多相关文章
- vue实现部分页面导入底部 vue配置公用头部、底部,可控制显示隐藏
vue实现部分页面导入底部 vue配置公用头部.底部,可控制显示隐藏 在app.vue文件里引入公共的header 和 footer header 和 footer 默认显示,例如某个页面不需要显示h ...
- CSS 相对/绝对(relative/absolute)定位与jQuery的控制显示隐藏
曾经写显示隐藏老是用jq方法控制: dom.show(); dom.hide(); 事实上这样还是有非常多缺陷的. 这是html结构: <div class="holi"&g ...
- vue slot插槽v-show不控制显示隐藏
vue中想控制插槽的显示隐藏,用v-show是不起任何作用的,改用v-if 可以生效.
- 使用element-ui中table expand展开行控制显示隐藏
问题讲解:在使用vue版本的ElementUI中的table功能的时候还是遇到了一些问题,可以说饿了么团队在这个UI框架的文档撰写已经非常不错了,不过还是有一些方法乍一看让人摸不着头脑,有些table ...
- 基于jquery封装通用的控制显示隐藏的方法
应用场景 在项目中会存在大量这样的需求: 1.选择不同的radio单选框,页面上的部分内容随之显示隐藏 2.选择不同的option下拉框内容,页面上的部分内容随之显示隐藏 如果每次遇到这类需求都单独写 ...
- js中按钮控制显示隐藏以及下拉功能
<script> function show() { var a2=document.getElementById("div2"); if(a2.style.displ ...
- JS控制显示/隐藏二级菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- checkbox控制显示隐藏
显示文本框<input type = "checkbox" id="checkbox" onclick="on_hide();"/&g ...
- jquery里面控制显示和隐藏 ___土狗toggle
$("#hide").click(function(){ $("p").hide(); }); $("#show").click(funct ...
- ECharts修改坐标轴,坐标轴字体,坐标轴网格样式以及控制坐标轴是否显示
转自:http://blog.csdn.net/kirinlau/article/details/72876689 首先要将一个图表显示在前端页面上: var myChart = echarts.in ...
随机推荐
- 打开host有感
一年前的呼喊,消失在了文化课的彼端,没有回音: 直至今日打开host,才发觉那时悔恨与泪水的珍贵. [此时此刻的光辉,盼君勿忘]也得加上过去式了啊--
- Kubernetes中Service学习笔记
我们知道 Pod 的生命周期是有限的.可以用 ReplicaSet 和Deployment 来动态的创建和销毁 Pod,每个 Pod 都有自己的 IP 地址,但是如果 Pod 重建了的话那么他的 IP ...
- 使用Ant Desigen在vue里面实现分页以及表头的模糊查询
一:分页 这次使用的是后端查来的数据在前端进行分页操作: 1.1: data里面的定义 tab1pagination: { defaultPageSize: 10, defaultCurrent:1, ...
- 有知道CAE软件Hypermesh的配置要求吗?
Altair的Hypermesh是一款先进的有限元分析软件,用于高效地处理和模拟复杂的三维几何形状.作为一款仿真软件,Hypermesh的CPU和GPU配置是非常重要的. 首先,对于Hypermesh ...
- 5分钟搞定!最全Dokploy部署n8n教程
最近n8n太火了,官方的次数有限,很多人有自己部署的需求.但常规的部署方案总是耗时耗力,拖慢整个开发节奏. 今天我分享一个我自己实践总结的Dokploy部署n8n的超详细教程,帮助你在短短几分钟内完成 ...
- 1 分钟,教你做出火爆全网的动物奥运会视频!附 AI 提示词
大家好,我是程序员鱼皮.上期给大家分享了 如何利用 AI 生成 ASMR 视频,虽然效果很好,但我也提到使用 Veo 3 每天只能生成 3 个视频,这个限制太坑了,根本不够用! 所以这期我给大家分享另 ...
- C# 23种设计模式汇总(更新完毕) john大叔
https://www.cnblogs.com/johntom/archive/2012/04/06/2435273.html C# 23种设计模式 创建型模式工厂方法(Factory Method ...
- java--Spring代理模式、AOP、jdbc支持
代理模式 静态代理, 1) 代理对象,要实现与目标对象一样的接口: 2) 举例:保存用户(模拟) Dao , 直接保存 DaoProxy, 给保存方法添加事务处理 App.java public cl ...
- 【6】树形DP学习笔记
前言 教练说过,树形 DP 是一个抽象的东西,很多状态比较难以理解,后面具体的学习方法,忘了. UPD on \(2024.11.21\):修复了例题 \(5\) 的假做法和假代码. 普通树形 DP ...
- Codeforces Round #669 ABC 题解
A. Ahahahahahahahaha 题意:给个一个偶数长度的01序列,要求删除不超过2/n个元素使得奇数位和等于偶数位和. 思路:注意到题目给的提示,只有0和1,且为偶数长度. 那么对和有贡献的 ...