• 百度Echarts柱状图实现渐变色并且每条柱子不同色


    // 前面的就不说了,直接从 series 开始
               series: [
                                {
                                    name: seriesName,
                                    type: 'bar',
                                    data: yAxis,
                                    label: {
                                        
                                        show: true,
                                        clickable: true,
                                        position: 'top',
                                        color: '#999999',
                                    },
                                    itemStyle: {
                                        normal: {
                                            color: function (params){
                                                let colorList = [
                                                    ['#FF516D', '#FFD1D9'],
                                                    ['#DF67F5', '#F4C7FC'],
                                                    ['#7245FF', '#D6C9FF'],
                                                    ['#4964FF', '#C4CDFF'],
                                                    ['#56BDED', '#CBE5F1'],
                                                    ['#4EE0B6', '#B7EBDC'],
                                                    ['#6AE34C', '#CAF3C0'],
                                                    ['#FFD140', '#FFEEBA'],
                                                    ['#FA8941', '#FED1B4'],
                                                    ['#FF2B2B', '#FFC4C4']
                                                ]
                                                let index = params.dataIndex;
                               // 这儿判断,如果图表中元素的个数大于预设色值数量时,让整个色值再循环使用 if(params.dataIndex >= colorList.length) { index = params.dataIndex % colorList.length; } return new echarts.graphic.LinearGradient(0, 0, 0, 1, [ { offset: 0, color: colorList[index][0] },
                                 /*
                                 其实中间还可以有中间值的,例如
                                  {
                                    offset: 0.5,
                                    color: red
                                  }
                                 */ { offset: 1, color: colorList[index][1] } ])           }, } } } ]

      

    愿世间所有的美好都会降临到每个人的身边
  • 相关阅读:
    Java 8 Lambda 表达式
    OSGi 系列(十二)之 Http Service
    OSGi 系列(十三)之 Configuration Admin Service
    OSGi 系列(十四)之 Event Admin Service
    OSGi 系列(十六)之 JDBC Service
    OSGi 系列(十)之 Blueprint
    OSGi 系列(七)之服务的监听、跟踪、声明等
    OSGi 系列(六)之服务的使用
    OSGi 系列(三)之 bundle 事件监听
    OSGi 系列(三)之 bundle 详解
  • 原文地址:https://www.cnblogs.com/boystao/p/14292021.html
Copyright © 2020-2023  润新知