• echarts图表x,y轴的设置


    https://www.cnblogs.com/cjh-strive/p/11065005.html

    xAxis属性代表echarts图表的x轴设置代码如下

    xAxis : [
    {
    type : 'category',
    // type:坐标轴类型。
    // [ default: 'category' ]
    /*可选:
    1.'value' 数值轴,适用于连续数据;
    2.'category' 类目轴,适用于离散的类目数据,为该类型时必须通过 data 设置类目数据;
    3.'time' 时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度;
    4.'log' 对数轴。适用于对数数据。*/
    data : ['上海','北京'], //x轴下面的数据
    axisTick: {
    show: false, //是否显示网状线 默认为true
    alignWithLabel: true
    },
    //用于设置x下面的字体
    axisLabel:{
    show:true, //这里的show用于设置是否显示x轴下的字体 默认为true
           interval:0, //可以设置成 0 强制显示所有标签。如果设置为 1,表示『隔一个标签显示一个标签』,如果值为 2,表示隔两个标签显示一个标签,以此类推。
      
           textStyle:{ //textStyle里面写x轴下的字体的样式
    color:'#333',
    fontSize:13
    }
    },
    axisLine:{
    show:true, //这里的show用于设置是否显示x轴那一条线 默认为true
    lineStyle:{ //lineStyle里面写x轴那一条线的样式
    color:'#6FC6F3',
    2, //轴线的粗细 我写的是2 最小为0,值为0的时候线隐藏
    }
    }
    },
    ]

    yAxis属性代表echarts图表的y轴,样式设置方式与x轴的方式是一样,就是设置的属性会有所差异

    yAxis:[{
    min:0, //y轴的最小值
    max:100, //y轴最大值
    interval:20, //值之间的间隔
    //上面的三个值可以根据自己需求随意设置 不设置时会根据图中的值自动生成相应的值

    type:'value',
    /* type坐标轴类型:[ default: 'value' ]
        可选:1.'value' 数值轴,适用于连续数据。
        2.'category' 类目轴,适用于离散的类目数据,为该类型时必须通过 data 设置类目数据。
    3.'time' 时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度。
    4.'log' 对数轴。适用于对数数据。*/
    splitLine:{show:false}, //去除网状线 默认为true
    //用于设置y轴的字体
    axisLabel:{
    show:true, //这里的show用于设置是否显示y轴下的字体 默认为true
    textStyle:{ //textStyle里面写y轴下的字体的样式
    color:'#333',
    fontSize:13
    }
    },
    //用于设置y轴的那一条线
    axisLine:{
    show:true, //这里的show用于设置是否显示y轴那一条线 默认为true
    lineStyle:{ //lineStyle里面写y轴那一条线的样式
    color:'#6FC6F3',
    2, //轴线的粗细 我写的是2 最小为0,值为0的时候线隐藏
    }
    }
    }]

  • 相关阅读:
    gerrit 修改前一次提交的方法(转载)
    数据结构实验之图论六:村村通公路 【克鲁斯卡尔算法】
    数据结构实验之图论五:从起始点到目标点的最短步数(BFS)
    数据结构实验之图论四:迷宫探索【dfs 求路径】
    Java 【打印俄文的英文字母】
    【留给自己的独白,长大了】
    Java 【 ArrayList应用 】 (SDUT 4069 C~K的班级)
    你的勇气去哪里了
    Java的 「 “ 结构体 ”」 与 「 “ 自定义排序 ” 」
    Java 中的 SimpleDateFormat 【 parse 和 format 】【转换时间格式】
  • 原文地址:https://www.cnblogs.com/xzybk/p/12565120.html
Copyright © 2020-2023  润新知