把天气爬取下来后用fastapi封装起来，用ECharts查询15天气信息，其中101191101代表常州市。 部分测试城市代号如下，将其放到下拉框中，选择显示该城市的15天天气： 101010100，北京 101020100，上海 101190401，苏州 101190201，无锡 101190101，南京 101190601，扬州 101190301，镇江 101240501，宜春 101070101，沈阳 101070601，丹东 101080701，鄂尔多斯 101081001，呼伦贝尔 101160701，张掖 101280101，广州 101280601，深圳 101300501，桂林 101300101，南宁 101260801，六盘水 101260506，黔东南 101260201，遵义 101310101，海口 101310201，三亚 101310222，五指山 101180801，开封 101180901，洛阳 101251101，张家界 101221001，黄山 101320101，香港 101330101，澳门
时间: 2023-06-13 20:04:51 浏览: 76
好的，我可以帮你实现这个功能。首先需要爬取天气信息，我可以使用Python的requests和BeautifulSoup库来进行爬取。以下是代码示例：
```python
import requests
from bs4 import BeautifulSoup
def get_weather(city_code):
url = f'http://www.weather.com.cn/weather/{city_code}.shtml'
headers = {
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36 Edge/16.16299',
'Referer': f'http://www.weather.com.cn/weather/{city_code}.shtml'
}
res = requests.get(url, headers=headers)
res.encoding = 'utf-8'
soup = BeautifulSoup(res.text, 'html.parser')
weather_list = []
for i in range(15):
date = soup.select('.tqtongji1 ul li h1')[i].text
weather = soup.select('.tqtongji1 ul li p')[i].text.replace('\n', '')
temperature = soup.select('.tqtongji1 ul li span')[i].text
weather_list.append({'date': date, 'weather': weather, 'temperature': temperature})
return weather_list
```
接下来，我们可以使用FastAPI来封装这个接口。以下是代码示例：
```python
from fastapi import FastAPI
from fastapi.responses import HTMLResponse
from fastapi.staticfiles import StaticFiles
from fastapi.templating import Jinja2Templates
app = FastAPI()
app.mount('/static', StaticFiles(directory='static'), name='static')
templates = Jinja2Templates(directory='templates')
@app.get('/', response_class=HTMLResponse)
async def index():
return templates.TemplateResponse('index.html', {'request': request})
@app.get('/weather/{city_code}', response_class=HTMLResponse)
async def weather(city_code, request: Request):
weather_list = get_weather(city_code)
return templates.TemplateResponse('weather.html', {'request': request, 'city_code': city_code, 'weather_list': weather_list})
```
最后，我们可以使用ECharts来展示天气信息。以下是HTML模板的代码示例：
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>15天天气预报</title>
<script src="https://cdn.staticfile.org/echarts/4.8.0/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width: 100%;height:600px;"></div>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'));
var option = {
title: {
text: '15天天气预报'
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['最高气温', '最低气温']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: [
{% for item in weather_list %}
'{{ item.date }}',
{% endfor %}
]
},
yAxis: {
type: 'value'
},
series: [
{
name: '最高气温',
type: 'line',
data: [
{% for item in weather_list %}
'{{ item.temperature.split("/")[1].replace("℃","") }}',
{% endfor %}
],
markPoint: {
data: [
{type: 'max', name: '最大值'},
{type: 'min', name: '最小值'}
]
},
markLine: {
data: [
{type: 'average', name: '平均值'}
]
}
},
{
name: '最低气温',
type: 'line',
data: [
{% for item in weather_list %}
'{{ item.temperature.split("/")[0].replace("℃","") }}',
{% endfor %}
],
markPoint: {
data: [
{type: 'max', name: '最大值'},
{type: 'min', name: '最小值'}
]
},
markLine: {
data: [
{type: 'average', name: '平均值'}
]
}
}
]
};
myChart.setOption(option);
</script>
</body>
</html>
```
这样，当用户选择城市后，就可以展示该城市未来15天的天气信息了。
相关推荐
最新推荐
vue中Axios的封装与API接口的管理详解
主要给大家介绍了关于vue中Axios的封装与API接口的管理的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
python接口自动化测试框架结构 ( 第二章)-封装Excel方法
python接口自动化测试框架结构 ( 第一章) 点击跳转到第一章，你可以知道框架结构！！ 前方高能！！正文开始！！ 1、在utlis.py封装Excel读写方法 （文件位置跳转第一章看代码结构） 大家需要知道，读取Excel分两种...
使用async await 封装 axios的方法
es6 的promise 逐步解决了层层回调的问题,es8的async await让异步变成了同步的写法,在vue中,可以通过封装axios,使得所有的请求都可以使用同步写法,同时处理错误信息等,可以建一个api.js文件,全局创建api实例. ...
JavaWeb设计城市公交查询系统（报告）
本次设计中采用的是JavaWeb的相关技术来完成系统的设计，利用了JDBC从数据库中获取相应的数据，并结合面向对象的思想对数据进行封装，始终贯穿MVC的开发模式和面向对象封装的思想来书写代码和模块。 2.2 基本思路 如...
如何使用Echarts设计专业的K线图
如何使用Echarts设计专业的K线图 先上图： Echarts所需的K线的数据结构有：时间(date)，开盘(open)，收盘(close)，最低(lowest)，最高(highest)，成交量（volume） 数据采用list列表形式封装，如： 时间（date），...
zigbee-cluster-library-specification
最新的zigbee-cluster-library-specification说明文档。
管理建模和仿真的文件
管理Boualem Benatallah引用此版本：布阿利姆·贝纳塔拉。管理建模和仿真。约瑟夫-傅立叶大学-格勒诺布尔第一大学，1996年。法语。NNT：电话：00345357HAL ID：电话：00345357https://theses.hal.science/tel-003453572008年12月9日提交HAL是一个多学科的开放存取档案馆，用于存放和传播科学研究论文，无论它们是否被公开。论文可以来自法国或国外的教学和研究机构，也可以来自公共或私人研究中心。L’archive ouverte pluridisciplinaire
实现实时数据湖架构：Kafka与Hive集成
# 1. 实时数据湖架构概述**
实时数据湖是一种现代数据管理架构，它允许企业以低延迟的方式收集、存储和处理大量数据。与传统数据仓库不同，实时数据湖不依赖于预先定义的模式，而是采用灵活的架构，可以处理各种数据类型和格式。这种架构为企业提供了以下优势：
- **实时洞察：**实时数据湖允许企业访问最新的数据，从而做出更明智的决策。
- **数据民主化：**实时数据湖使各种利益相关者都可
2． 通过python绘制y=e-xsin(2πx)图像
可以使用matplotlib库来绘制这个函数的图像。以下是一段示例代码：
```python
import numpy as np
import matplotlib.pyplot as plt
def func(x):
return np.exp(-x) * np.sin(2 * np.pi * x)
x = np.linspace(0, 5, 500)
y = func(x)
plt.plot(x, y)
plt.xlabel('x')
plt.ylabel('y')
plt.title('y = e^{-x} sin(2πx)')
plt.show()
```
运行这段
JSBSim Reference Manual
JSBSim参考手册，其中包含JSBSim简介，JSBSim配置文件xml的编写语法，编程手册以及一些应用实例等。其中有部分内容还没有写完，估计有生之年很难看到完整版了，但是内容还是很有参考价值的。