ID

34

配置代码

var option = {
        backgroundColor: '#000',
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: ['离汉通道暂时关闭','离汉离鄂通道解除管控'],
            itemWidth: 20,
            itemHeight: 10,
            itemGap: 10,
            left: 135,
            bottom: 2,
            textStyle: {
                fontSize: 14,
                fontWeight: "bolder",
                color: '#fff'
            }
        },
        grid: {
            left: '8%',
            right: '8%',
            bottom: '12%',
            top: '10%',
            containLabel: true
        },
        xAxis: {
            type: 'value',
            axisLabel: {
                show: true,
                textStyle: {
                    color: '#fff'
                }
            },
            axisLine: {
                lineStyle: {
                    color: "#1df9b8",
                    opacity: 0.3,
                    width: 1
                }
            },
            splitLine: {
                show: true,
                lineStyle: {
                    color: 'rgba(29, 249, 184, 0.1)'
                }
            }
        },
        yAxis: {
            type: 'category',
            axisLine: {onZero: false},
            boundaryGap: false,
            axisLabel: {
                show: true,
                textStyle: {
                    color: '#fff'
                }
            },
            axisLine: {
                lineStyle: {
                    color: "#1df9b8",
                    opacity: 0.3,
                    width: 1
                }
            },
            data: dates
        },
        series: [
            {
                name: "离汉通道暂时关闭",
                type: 'line',
                smooth: true,
                symbolSize: 10,
                lineStyle: {
                    normal: {
                        color: "#faf800",
                        width: 5
                    }
                },
                itemStyle: {
                    normal: {
                        label: {show: false},
                        color: "#faf800"
                    }
                },
                areaStyle: {
                    origin: 'start',
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 1,
                        color: 'rgba(250, 250, 0, 0.8)'
                    }, {
                        offset: 0,
                        color: 'rgba(250, 250, 0, 0.1)'
                    }])
                },
                data: datas1
            },
            {
                name: "离汉离鄂通道解除管控",
                type: 'line',
                smooth: true,
                symbolSize: 10,
                lineStyle: {
                    normal: {
                        color: "#1ffaae",
                        width: 5
                    }
                },
                itemStyle: {
                    normal: {
                        label: {show: false},
                        color: "#1ffaae"
                    }
                },
                areaStyle: {
                    origin: 'start',
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 1,
                        color: 'rgba(27, 249, 188, 0.8)'
                    }, {
                        offset: 0,
                        color: 'rgba(27, 249, 188, 0.1)'
                    }])
                },
                data: datas
            }
        ]
    };

完整示例代码