用Django写天气预报查询网站


Posted in Python onOctober 21, 2018

创建项目

创建工程项目如下所示:

用Django写天气预报查询网站

设置文件settings.py中的设置主要有两个

1.注册app

2.设置templates的路径

前面的文章已经介绍过多次如何设置了,此处不再做详细赘述。

接口api为:http://api.map.baidu.com/telematics/v3/weather?location=%E9%83%91%E5%B7%9E&output=json&ak=TueGDhCvwI6fOrQnLM0qmXxY9N0OkOiQ&callback=?

主要流程分以下几步:

1.从接口获取数据,经过urls.py文件传送给index.html文件。

2.在index.html文件中做界面处理,使界面美观好看。

3.添加查询功能。

获取数据和传送数据在前面的电影查询网站已经讲过 ,这里着重说一下添加查询功能的原理。

本次仍然是用form表单实现查询功能,form表单的method不做设置的话会默认get请求,当我们第一次传送数据到界面之后,

可以在form表单设置个请求方式,然后在下次请求数据的时候,添加一个判断,判断的时候把form表单输入的城市信息更改

为下次请求的时候的城市信息即可。

下附代码:

视图文件views.py文件中的代码如下:

from django.shortcuts import render
import requests
# Create your views here.
def index(request):
  if request.method == 'POST':
    city = request.POST['city']
    url = 'http://api.map.baidu.com/telematics/v3/weather?location={}&output=json&ak=TueGDhCvwI6fOrQnLM0qmXxY9N0OkOiQ&callback=?'.format(city)
  else:
    url = 'http://api.map.baidu.com/telematics/v3/weather?location=%E9%83%91%E5%B7%9E&output=json&ak=TueGDhCvwI6fOrQnLM0qmXxY9N0OkOiQ&callback=?'
  json_data = requests.get(url).json()
  weather = json_data['results'][0]['weather_data']
  today_weather = weather[0]
  t_weather = weather[1]
  tt_weather = weather[2]
  ttt_weather =weather[3]
  city = json_data['results'][0]['currentCity']
  context = {
    'today':today_weather,
    'city':city,
    'list':[t_weather,tt_weather,ttt_weather]
  }
  return render(request,'index.html',context)

urls.py文件中的代码如下:

from django.contrib import admin
from django.urls import path
from myApp import views
urlpatterns = [
  path('admin/', admin.site.urls),
  path('index/',views.index),
  path('select/',views.index),
]

index.html界面文件代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>{{city}}天气信息</title>
  <style>
    html,body{
      height:100%;
      margin:0;
      color: white;
      text-align: center;
    }
    body{
      /*渐变色*/
      background: linear-gradient(#1078c7,#7196b4);
    }
    form{
      text-align: center;
    }
    main img{
      width: 80px;
    }
    h1{
      margin:5px;
    }
    footer{
      display: flex;
    }
    section{
      flex-grow: 1;
      border-right:1px solid greenyellow;
    }
    section:nth-child(3){
      border:none;
    }
  </style>
</head>
<body>
  <form action="/select/" method="POST">
    {% csrf_token %}
    <input name="city" type="text" placeholder="请输入城市">
    <button type="submit">查询</button>
  </form>
  <main>
    <h2>实时天气</h2>
    <img src="{{today.dayPictureUrl}}" alt="">
    <h1>{{today.temperature}}</h1>
    <div>
      {{today.weather}}<br>
      {{today.wind}}<br>
      {{today.date}}<br>
    </div>
  </main>
  <footer>
    {% for weather in list %}
      <section>
        <h4>{{weather.date}}</h4>
        <img src="{{weather.dayPictureUrl}}" alt="">
        <div>
          {{weather.temperature}}<br>
          {{weather.weather}}<br>
          {{weather.wind}}<br>
        </div>
      </section>
    {% endfor %}
  </footer>
</body>
</html>

python manage.py runserver 启动服务器,在浏览器打开网址,即可看到效果:

 用Django写天气预报查询网站

在上面的查询框中输入城市名,即可查询别的城市天气信息:

用Django写天气预报查询网站

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Python 相关文章推荐
Python编写检测数据库SA用户的方法
Jul 11 Python
python处理csv数据动态显示曲线实例代码
Jan 23 Python
用python写扫雷游戏实例代码分享
May 27 Python
NumPy.npy与pandas DataFrame的实例讲解
Jul 09 Python
pycharm中成功运行图片的配置教程
Oct 28 Python
Python读取stdin方法实例
May 24 Python
python pytest进阶之conftest.py详解
Jun 27 Python
python支付宝支付示例详解
Aug 22 Python
Python3.x+pyqtgraph实现数据可视化教程
Mar 14 Python
Python pip安装第三方库实现过程解析
Jul 09 Python
pandas使用函数批量处理数据(map、apply、applymap)
Nov 27 Python
如何用Python搭建gRPC服务
Jun 30 Python
Django中数据库的数据关系:一对一,一对多,多对多
Oct 21 #Python
python高效过滤出文件夹下指定文件名结尾的文件实例
Oct 21 #Python
Python根据文件名批量转移图片的方法
Oct 21 #Python
浅谈Python中的bs4基础
Oct 21 #Python
python清除字符串前后空格函数的方法
Oct 21 #Python
Windows系统下PhantomJS的安装和基本用法
Oct 21 #Python
Scrapy框架使用的基本知识
Oct 21 #Python
You might like
全国中波电台频率表
2020/03/11 无线电
PHP开发框架kohana3 自定义路由设置示例
2014/07/14 PHP
Yii2创建表单(ActiveForm)方法详解
2016/07/23 PHP
javascript实现汉字转拼音代码分享
2015/04/20 Javascript
微信WeixinJSBridge API使用实例
2015/05/25 Javascript
JQuery入门基础小实例(1)
2015/09/17 Javascript
jQuery实现用户信息表格的添加和删除功能
2017/09/12 jQuery
Vue 应用中结合vux使用微信 jssdk的方法
2018/08/28 Javascript
vue添加class样式实例讲解
2019/02/12 Javascript
详解vue使用插槽分发内容slot的用法
2019/03/28 Javascript
微信小程序image图片加载完成监听
2019/08/31 Javascript
echarts 使用formatter 修改鼠标悬浮事件信息操作
2020/07/20 Javascript
总结Python编程中三条常用的技巧
2015/05/11 Python
Python 爬虫的工具列表大全
2016/01/31 Python
Sublime开发python程序的示例代码
2018/01/24 Python
python实现简单遗传算法
2018/03/19 Python
Python实现的凯撒密码算法示例
2018/04/12 Python
Python实现多属性排序的方法
2018/12/05 Python
python实现车牌识别的示例代码
2019/08/05 Python
python实现二分类的卡方分箱示例
2019/11/22 Python
用Python去除图像的黑色或白色背景实例
2019/12/12 Python
python新式类和经典类的区别实例分析
2020/03/23 Python
CSS3制作半透明边框(Facebox)类似渐变
2012/12/09 HTML / CSS
AmazeUI 网格的实现示例
2020/08/13 HTML / CSS
Under Armour安德玛荷兰官网:美国高端运动科技品牌
2019/07/10 全球购物
运动会广播稿30字
2014/01/21 职场文书
《植物妈妈有办法》教学反思
2014/02/25 职场文书
《新型玻璃》教学反思
2014/04/13 职场文书
五四青年节演讲稿
2014/05/26 职场文书
镇创先争优活动总结
2014/08/28 职场文书
沙滩主题婚礼活动策划方案
2014/09/15 职场文书
鲁迅故居导游词
2015/02/05 职场文书
2015年信访工作总结
2015/04/07 职场文书
幼儿园园长六一致辞
2015/07/31 职场文书
食品安全主题班会
2015/08/13 职场文书
Python如何配置环境变量详解
2021/05/18 Python