Echarts在线免费图表

 
            let dataList = [{
    name: '高危',
    value: '30'
}]

option = {
    series: [{
        type: 'gauge',
        radius: '100%',
        center: ['50%', '50%'],
        splitNumber: 0, //刻度数量
        startAngle: 210,
        endAngle: -30,
        axisLine: {
            show: true,
            lineStyle: {
                width: 20,
                color: [
                    [
                        dataList[0].value / 100, new echarts.graphic.LinearGradient(
                            0, 0, 1, 0, [{
                                    offset: 0,
                                    color: '#01E9FF'
                                },
                                {
                                    offset: 0.63,
                                    color: '#FFD408'
                                }, {
                                    offset: 1,
                                    color: '#FF0000'
                                }
                            ]
                        )
                    ],
                    [
                        1, '#265DA7'
                    ]
                ],
            }
        },
        //分隔线样式。
        splitLine: {
            show: false,
        },
        axisLabel: {
            show: false
        },
        axisTick: {
            show: false
        },
        pointer: {
            show: false
        },
        title: {
            show: true,
            offsetCenter: [0, '40%'], // x, y，单位px
            textStyle: {
                color: '#FFD408',
                fontSize: 24,
                fontWeight: '400'
            }
        },
        //仪表盘详情，用于显示数据。
        detail: {
            show: true,
            offsetCenter: [0, '-10%'],
            color: '#FFD408',
            formatter: function(params) {
                return params + '%'
            },
            textStyle: {
                fontSize: 34
            }
        },
        data: dataList
    }]
};