zoukankan      html  css  js  c++  java
  • vue echarts 柱状图 变色 显示

    
    
    echartscustom2(id,title,xdata,ydata){
                var chartDom = document.getElementById(id);
                var myChart = echarts.init(chartDom);
                var option;
                option = {
                    title:{
                        text:title,
                        left:"center"
                    },
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'shadow'
                        },
                    },
                    xAxis: {
                        type: 'value',
                        axisLabel:{show:false}
                    },
                    yAxis: {
                        type: 'category',
                        data: ydata,
                        axisLabel:{show:false}
                    },
                    series: [{
                        data: xdata,
                        type: 'bar',
                        itemStyle: {
                            normal: {
                                color: function(params) {
                                    var colorList = ['#5470c6', '#91cc75','#fac858','#ee6666','#73c0de','#3ba272','#fc8452','#9a60b4','#ea7ccc',];
                                    var index=params.dataIndex%colorList.length;
                                    return colorList[index]
                                }
                            }
                        },
                    }],
                };
                option && myChart.setOption(option);

            },
     

    xdata,ydata自造数组,color为滚动显示颜色组的颜色

  • 相关阅读:
    一些面试题(2)
    poj1102 7段数码管
    一些面试题(3)
    poj百练2737大整数除法
    枚举
    poj2244 约瑟夫环
    [Craftor原创]精通ModelSim脚本(1)
    [Craftor原创]带FIFO的UART收发器设计
    继电器的一些基本术语
    Every success is a creation for me
  • 原文地址:https://www.cnblogs.com/huanyun/p/14486840.html
Copyright © 2011-2022 走看看