zoukankan      html  css  js  c++  java
  • 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]
                  }
                }
              }
            }
          ]
    

      

    看繁华,听风落
  • 相关阅读:
    转移阵地啦
    春之感--3月10日
    小鱼儿
    关于时间方法(date和simpledateformat)的实验
    hadoop练习处理地震数据
    出现log4j.properties问题
    远程hadoop集群方法
    小W学物理
    灵知的太阳信仰
    Blue
  • 原文地址:https://www.cnblogs.com/lgnblog/p/14360444.html
Copyright © 2011-2022 走看看