echarts 仪表盘 底部有金字塔（梯形）

var option = {
            series: (function() {
                var result = [];
        
                data.forEach(function(item) {
                    if(item.value<0){
                        status=0
                    }else if(item.value<16){
                        status=1
                    }else if(item.value<26){
                        status=2
                    }else if(item.value<40){
                        status=3
                    }else{
                        status=4
                    }
                    result.push(
                        {//底部梯形
                            name:'金字塔',
                            type:'funnel',
                            x : 'center',
                            y:"76%",
                            minSize:"68%",
                            width:"40%",
                            height:"11%",
                            sort : 'ascending',
                            itemStyle: {
                                normal: {
                                    borderWidth:0,
                                    color: that.state.color1[status],
                                    label: {
                                        position: 'center'
                                    }
                                }
                            },
                            data:[
                                {value: item.value},
                            ]
                        },
                        // 外圈的线
                        {
                            name: item.name,
                            type: 'gauge',
                            center: item.pos,
                            radius: '90%',
                            startAngle: 229,
                            endAngle: -49,
                            min: -10,
                            max: 50,
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    width: 2,
                                    color: [
                                        [
                                            100, new echarts.graphic.LinearGradient(
                                                0, 0, 1, 0, [
                                                    {
                                                        offset: 1,
                                                        color: that.state.color1[status],
                                                    }
                                                ]
                                            )
                                        ],
                                        [
                                            1, 'rgba(255,255,255, 0)'
                                        ]
                                    ]
                                }
                            },
                            axisTick: {//坐标轴小标记
                                show: 0,
                            },
                            splitLine: {//分割线
                                show: 0,
                            },
                            axisLabel: {//刻度数
                                show: 0
                            },
                            pointer: {//是否显示指针
                                show: 0,
                            },
                            detail: {//是否显示详情
                                show: 0
                            },
                            data: [{
                                value: item.value,
                            }]
                        },                        
                        
                        // 外围刻度颜色
                        {
                            name: item.name,
                            type: 'gauge',
                            center: item.pos,
                            radius: '86%',
                            startAngle: 225,
                            endAngle: -45,
                            min: -10,
                            max: 50,
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    width: 15,
                                    color:  [
                                        [0.166, that.state.color1[0]],[0.17, '#000000'], 
                                        [0.43, that.state.color1[1]],[0.434, '#000000'], 
                                        [0.6, that.state.color1[2]],[0.604, '#000000'], 
                                        [0.83, that.state.color1[3]],[0.834, '#000000'], 
                                        [1, that.state.color1[4]]
                                    ]
                                }
                            },
                            axisTick: {
                                show: 0,
                            },
                            splitLine: {
                                show: 0,
                            },
                            axisLabel: {
                                show: 0
                            },
                            pointer: {
                                show: true,
                                length: '100%',
                                width: 3
                            },
                            title: {//标题-温度湿度的颜色
                                show: true,
                                offsetCenter: [0, '70%'],
                                color: 'black',
                                fontSize: 15,
                                fontWeight: 'bold',
                                // backgroundColor: "#D8d8d8",
                                borderRadius: 21,
                                padding: 5
                            },
                            detail: {//数值
                                show: 0,
                                // offsetCenter: [0, 24],
                                // textStyle: {
                                //     fontSize: 25,
                                //     color: '#ffffff'
                                // },
                                // formatter: [
                                //     // '{value}' + (item.unit || ''),
                                //     '{name|' + item.name + '}'
                                // ].join(' '),
        
                                // rich: {
                                //     name: {
                                //         fontSize: 20,
                                //         lineHeight: 10,
                                //         color: '#ddd',
                                //         padding: [30, 0, 0, 0]
                                //     }
                                // }
                            },
                            itemStyle: {
                                normal: {
                                    color: that.state.color1[status],
                                }
                            },
                            data: [{
                                value: item.value,
                                name:item.name,
                            }]
                        },
                        // 刻度数值、指针
                        {
                            type: 'gauge',
                            center: item.pos,
                            radius: '70%', // 1行3个
                            splitNumber: item.splitNum || 6,
                            min: -10,//最小数据值
                            max: 50,//最大数据值
                            startAngle: 225,
                            endAngle: -45,
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    width: 1,
                                    color: [
                                        [1, 'rgba(0,0,0,0)']
                                    ]
                                }
                            }, 
                            axisTick: {//坐标轴小标记
                                show: true,
                                lineStyle: {
                                    color: 'rgba(255,255,255,0.6)',
                                    width: 1
                                },
                                length: 3
                            }, 
                            splitLine: {//分割线
                                show: true,
                                length: 8,
                                lineStyle: {
                                    color: 'rgba(255,255,255,0.6)'
                                }
                            }, 
                            axisLabel: {
                                show: true,
                                distance: 2,
                                textStyle: {
                                    color: '#ffffff',
                                    fontSize: '12',
                                    // fontWeight: 'bold'
                                }
                            },
                            pointer: {//指针
                                show: 0
                            },
                            detail: {//详情
                                // show: 0
                                offsetCenter: [0, 0],
                                textStyle: {
                                    fontSize: 25,
                                    color: '#ffffff'
                                },
                                formatter: [
                                    '{unit|' + item.unit + '}',
                                    '{value}' //+ (item.unit || ''),
                                    /* '{name|' + item.name + '}'*/
                                ].join('\n'),
                                rich: {
                                    unit: {
                                        fontSize: 15,
                                        lineHeight: 30,
                                        color: '#fff',
                                        // padding: [30, 0, 0, 0]
                                    }
                                },
                                backgroundColor: status==3?'#081327':(status==4?'#6a2028':'#0c2140'),
                                color : "#fff",
                                shadowBlur:44,
                                borderRadius:58,
                                borderColor:'#90C7FF',
                                borderWidth:1,
                                width:54,
                                height:64,
                            },
                            data: [{
                                value: item.value,
                            }]
                        },
                        // 告警背景
                        {//下面一半
                            type: 'gauge',
                            center: item.pos,
                            radius: '70%',
                            startAngle: 0,
                            endAngle: 180,
                            min: -10,
                            max: 50,
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    width: 1000,
                                    color: [
                                        [
                                           100, new echarts.graphic.LinearGradient(
                                                0, 0, 1, 0, [
                                                    {
                                                        offset: 1,
                                                        color: status==3?'rgba(228, 150, 44, 0.5)':(status==4?'rgba(237, 37, 37, 0.5)':'rgba(0, 0, 0, 0)'),
                                                    }
                                                ]
                                            )
                                        ],
                                    ]
                                }
                            },
                             axisTick: {
                                show: 0,
                            },
                            splitLine: {
                                show: 0,
                            },
                            axisLabel: {
                                show: 0
                            },
                               pointer: {
                                show: 0,
                            },
                            detail: {
                                show: 0
                            },
                        },
                        {//上面一半       
                            type: 'gauge',
                            center: item.pos,
                            radius: '70%',
                            startAngle: 180,
                            endAngle: 360,
                            min: -10,
                            max: 50,
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    width: 1000,
                                    color: [
                                        [
                                           100, new echarts.graphic.LinearGradient(
                                                0, 0, 1, 0, [
                                                    {
                                                        offset: 1,
                                                        color: status==3?'rgba(228, 150, 44, 0.5)':(status==4?'rgba(237, 37, 37, 0.5)':'rgba(0, 0, 0, 0)'),
                                                    }
                                                ]
                                            )
                                        ],
                                    ]
                                }
                            },
                             axisTick: {
                                show: 0,
                            },
                            splitLine: {
                                show: 0,
                            },
                            axisLabel: {
                                show: 0
                            },
                               pointer: {
                                show: 0,
                            },
                            detail: {
                                show: 0
                            },
                        },
                        

                    );
                });
        
                return result;
            })()
        };