python_weather/web/js/chart5.js

function echarts_5() {
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('echart5'));

    var xData = Chart5_Data.x;
    var yData = Chart5_Data.y;

    // 指定图表的配置项和数据
    var option = {
        // title: {
        //     text: '重庆市现在平均湿度地区排名',
        //     subtext: '数据来源：气象局'
        // },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'shadow'
            },
            formatter: function (params) {
                return params[0].name + ': ' + params[0].value + '%';
            }
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            data: xData,
            axisLabel: {
                interval: 0,
                // rotate:50,
                show: true,
                splitNumber: 15,
                textStyle: {
                    color: "rgba(255,255,255,.6)",
                    fontSize: '12',
                }
            },
        },
        yAxis: {
            interval: 5, // 指定刻度间隔
            min: 70,
            max: 100,
            type: 'value',

            axisLabel: {
                formatter: '{value}%',
                interval: 0,
                // rotate:50,
                show: true,
                splitNumber: 15,
                textStyle: {
                    color: "rgba(255,255,255,.6)",
                    fontSize: '12',
                },
            },
        },
        series: [
            {
                name: '平均湿度',
                type: 'bar',
                data: yData,
                itemStyle: {
                    color: '#6699FF'
                }
            }
        ]
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
    window.addEventListener("resize", function () {
        myChart.resize();
    });
}