Echarts在线免费图表

 
            option = {
    //你的代码
    backgroundColor: '#081736',
    tooltip: {
        trigger: 'axis',
        backgroundColor: 'rgba(17,95,182,0.5)',
        textStyle: {
            color: "#fff"
        },
        axisPointer: {
            type: 'shadow'
        }
    },
    legend: {
        data: ['好', '较好', '一般'],
        align: 'left',
        right: 50,
        top: 80,
        textStyle: {
            color: "rgba(255,255,255,0.8)"
        },
        itemWidth: 13,
        itemHeight: 10,
        itemGap: 25
    },
    grid: {
        top: '23%',
        left: '8%',
        right: '8%',
        bottom: '13%',
        containLabel: true
    },
    xAxis: [{
        type: 'category',
        data: ['草堂镇',
            '白帝镇',
            '朱衣镇',
            '康乐镇',
            '永乐镇',
            '安坪镇'
        ],
        axisLine: {
            show: true,
            lineStyle: {
                color: "#063374",
                width: 1,
                type: "solid"
            }
        },
        axisTick: {
            show: false,
        },
        axisLabel: {
            show: true,
            textStyle: {
                color: 'rgba(255,255,255,0.8)',
                fontSize: 14
            }
        },
    }],
    yAxis: [{
        name: '(万亩)',
        nameTextStyle: {
            color: 'rgba(255,255,255,0.8)'
        },
        type: 'value',
        axisLabel: {
            formatter: '{value}',
            textStyle: {
                color: 'rgba(255,255,255,0.8)',
                fontSize: 14
            }
        },
        axisTick: {
            show: false,
        },
        axisLine: {
            show: true,
            lineStyle: {
                color: "#063374",
                width: 1,
                type: "solid"
            },
        },
        splitLine: {
            lineStyle: {
                color: "#063374",
                type: ""
            }
        }
    }],
    series: [{
        name: '好',
        type: 'bar',
        data: [90, 95, 120, 110, 98, 130],
        barWidth: 8, //柱子宽度
        barGap: 1, //柱子之间间距
        itemStyle: {
            normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                    offset: 0,
                    color: '#00FFB4'
                }, {
                    offset: 1,
                    color: 'rgba(0, 255, 255, 0.1)',
                }]),
                opacity: 1,
            }
        }
    }, {
        name: '较好',
        type: 'bar',
        data: [22, 20, 25, 28, 25, 22],
        barWidth: 8,
        barGap: 1,
        itemStyle: {
            normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                    offset: 0,
                    color: '#0291FF'
                }, {
                    offset: 1,
                    color: 'rgba(12, 135, 230, 0.1)'
                }]),
                opacity: 1,
            }
        }
    }, {
        name: '一般',
        type: 'bar',
        data: [17, 18, 13, 18, 13, 17],
        barWidth: 8,
        barGap: 1,
        itemStyle: {
            normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                    offset: 0,
                    color: '#FEC060'
                }, {
                    offset: 1,
                    color: 'rgba(254, 192, 96, 0.1)'
                }]),
                opacity: 1,
            }
        }
    }]
};

if (option && typeof option === "object") {
    myChart.setOption(option, true);
    refreshChart(myChart, option);
    var index4 = 0; //播放所在下标
    var mTime = setInterval(function () {
        myChart.dispatchAction({
            type: 'showTip',
            seriesIndex: 0,
            dataIndex: index4
        });
        index4++;
        if (index4 >= 6) {
            //console.log('data4', fxdata.length)
            index4 = 0;
            //console.log(fxdata)
        }
    }, 2800);
}

// 刷新图表
function refreshChart(chartID, option) {
    setInterval(function () {
        chartID.clear();
        chartID.setOption(option, true)
    }, 10000)
}