给每个柱状图的柱子添加不同颜色的渐变

给每个柱状图的柱子添加不同颜色的渐变

series: [{
                        name: '法律状态',
                        type: 'bar',
                        barWidth: '40',
                        data: dataValue.splice(0, 10), //[10, 52, 200, 334, 390, 330, 220,450],
                        label: {
                            normal: {
                                show: true,
                                position: 'top',
                                textStyle: {
                                    color: function(params) {
                                        var IP1 = new echarts.graphic.LinearGradient(
                                            0,
                                            1,
                                            0,
                                            0, // 0,0,1,0表示从左向右    0,0,0,1表示从右向左
                                            [{
                                                    offset: 1,
                                                    color: 'rgba(109,102,193,1)'
                                                },

                                                {
                                                    offset: 0,
                                                    color: 'rgba(109,102,193,1)',
                                                }
                                            ]
                                        )
                                        var IP2 = new echarts.graphic.LinearGradient(
                                            0,
                                            1,
                                            0,
                                            0, // 0,0,1,0表示从左向右    0,0,0,1表示从右向左
                                            [{
                                                    offset: 1,
                                                    color: 'rgba(36,185,228,1)'
                                                },

                                                {
                                                    offset: 0,
                                                    color: 'rgba(36,185,228,1)',
                                                }
                                            ]
                                        )
                                        var IP3 = new echarts.graphic.LinearGradient(
                                            0,
                                            1,
                                            0,
                                            0, // 0,0,1,0表示从左向右    0,0,0,1表示从右向左
                                            [{
                                                    offset: 1,
                                                    color: 'rgba(235,168,35,1)'
                                                },

                                                {
                                                    offset: 0,
                                                    color: 'rgba(235,168,35,1)',
                                                }
                                            ]
                                        )
                                        var colorList = [IP1, IP2, IP3, IP1, IP2, IP3, IP1, IP2];
                                        return colorList[params.dataIndex];

                                    }
                                }
                            }

                        },
                        itemStyle: {
                            normal: {
                                color: function(params) {
                                    var IP1 = new echarts.graphic.LinearGradient(
                                        0,
                                        1,
                                        0,
                                        0, // 0,0,1,0表示从左向右    0,0,0,1表示从右向左
                                        [{
                                                offset: 1,
                                                color: 'rgba(109,102,193,1)'
                                            },

                                            {
                                                offset: 0,
                                                color: 'rgba(109,102,193,0)',
                                            }
                                        ]
                                    )
                                    var IP2 = new echarts.graphic.LinearGradient(
                                        0,
                                        1,
                                        0,
                                        0, // 0,0,1,0表示从左向右    0,0,0,1表示从右向左
                                        [{
                                                offset: 1,
                                                color: 'rgba(36,185,228,1)'
                                            },

                                            {
                                                offset: 0,
                                                color: 'rgba(36,185,228,0)',
                                            }
                                        ]
                                    )
                                    var IP3 = new echarts.graphic.LinearGradient(
                                        0,
                                        1,
                                        0,
                                        0, // 0,0,1,0表示从左向右    0,0,0,1表示从右向左
                                        [{
                                                offset: 1,
                                                color: 'rgba(235,168,35,1)'
                                            },

                                            {
                                                offset: 0,
                                                color: 'rgba(235,168,35,0)',
                                            }
                                        ]
                                    )
                                    var colorList = [IP1, IP2, IP3, IP1, IP2, IP3, IP1, IP2];
                                    return colorList[params.dataIndex];

                                }
                            }
                        },
                    }]

你可能感兴趣的:(给每个柱状图的柱子添加不同颜色的渐变)