用APL天气接口和Echarts绘制24小时气温变化折线图

由于缺少具体的API接口信息和数据格式，以下代码仅提供一个基本的框架和示例数据，需要根据实际情况进行修改。

HTML代码：

<div id='chart' style='width: 800px;height:400px;'></div>

JS代码：

// 示例数据
var data = [
    {'time': '0:00', 'temperature': 15},
    {'time': '1:00', 'temperature': 14},
    {'time': '2:00', 'temperature': 14},
    {'time': '3:00', 'temperature': 13},
    {'time': '4:00', 'temperature': 13},
    {'time': '5:00', 'temperature': 12},
    {'time': '6:00', 'temperature': 11},
    {'time': '7:00', 'temperature': 12},
    {'time': '8:00', 'temperature': 13},
    {'time': '9:00', 'temperature': 14},
    {'time': '10:00', 'temperature': 15},
    {'time': '11:00', 'temperature': 16},
    {'time': '12:00', 'temperature': 17},
    {'time': '13:00', 'temperature': 18},
    {'time': '14:00', 'temperature': 20},
    {'time': '15:00', 'temperature': 21},
    {'time': '16:00', 'temperature': 22},
    {'time': '17:00', 'temperature': 22},
    {'time': '18:00', 'temperature': 20},
    {'time': '19:00', 'temperature': 18},
    {'time': '20:00', 'temperature': 17},
    {'time': '21:00', 'temperature': 16},
    {'time': '22:00', 'temperature': 15},
    {'time': '23:00', 'temperature': 14}
];

// 初始化echarts图表
var myChart = echarts.init(document.getElementById('chart'));

// 配置项
var option = {
    title: {
        text: '24小时气温变化',
        subtext: '示例数据'
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data:['气温']
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: data.map(function(item) { return item.time; })
    },
    yAxis: {
        type: 'value',
        axisLabel: {
            formatter: '{value} °C'
        }
    },
    series: [{
        name: '气温',
        type: 'line',
        data: data.map(function(item) { return item.temperature; }),
        markPoint: {
            data: [
                {type: 'max', name: '最大值'},
                {type: 'min', name: '最小值'}
            ]
        },
        markLine: {
            data: [
                {type: 'average', name: '平均值'}
            ]
        }
    }]
};

// 使用刚指定的配置项和数据显示图表
myChart.setOption(option);