用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实现按学生年龄排序的实际问题详解
Aug 29 Python
python批量修改文件编码格式的方法
May 31 Python
Python操作MySQL数据库的方法
Jun 20 Python
Python 找到列表中满足某些条件的元素方法
Jun 26 Python
pandas 层次化索引的实现方法
Jul 06 Python
python 提取文件指定列的方法示例
Aug 07 Python
python基于socket实现的UDP及TCP通讯功能示例
Nov 01 Python
opencv+python实现均值滤波
Feb 19 Python
如何使用pycharm连接Databricks的步骤详解
Sep 23 Python
最新pycharm安装教程
Nov 18 Python
详解Python中的文件操作
Jan 14 Python
python 制作本地应用搜索工具
Feb 27 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
PHP中冒号、endif、endwhile、endfor使用介绍
2010/04/28 PHP
php中flush()、ob_flush()、ob_end_flush()的区别介绍
2013/02/17 PHP
Laravel 框架控制器 Controller原理与用法实例分析
2020/04/14 PHP
jQuery动态添加 input type=file的实现代码
2012/06/14 Javascript
javascript顺序加载图片的方法
2015/07/18 Javascript
详解JavaScript ES6中的Generator
2015/07/28 Javascript
百度地图给map添加右键菜单(判断是否为marker)
2016/03/04 Javascript
Bootstrap Validator 表单验证
2016/07/25 Javascript
每个程序员都需要学习 JavaScript 的7个理由小结
2016/09/03 Javascript
etmvc+jQuery EasyUI+combobox多值操作实现角色授权实例
2016/11/09 Javascript
Node.js制作简单聊天室
2017/01/12 Javascript
jquery实现页面加载效果
2017/02/21 Javascript
Vuex之理解Mutations的用法实例
2017/04/19 Javascript
for循环 + setTimeout 结合一些示例(前端面试题)
2017/08/30 Javascript
基于jQuery Ajax实现下拉框无刷新联动
2017/12/06 jQuery
微信小程序实现跑马灯效果完整代码(附效果图)
2018/05/30 Javascript
nodejs二进制与Buffer的介绍与使用
2019/07/11 NodeJs
Node中对非阻塞I/O、事件循环的知识点总结
2020/01/05 Javascript
[05:36]DOTA2 2015国际邀请赛中国区预选赛第四日TOP10
2015/05/29 DOTA
Python实现发送email的几种常用方法
2014/08/18 Python
用Python的Django框架来制作一个RSS阅读器
2015/07/22 Python
Pycharm远程调试openstack的方法
2017/11/21 Python
详解用Python处理HTML转义字符的5种方式
2017/12/27 Python
Python实现将数据写入netCDF4中的方法示例
2018/08/30 Python
解决Python print输出不换行没空格的问题
2018/11/14 Python
Flask框架钩子函数功能与用法分析
2019/08/02 Python
python简单实现最大似然估计&amp;scipy库的使用详解
2020/04/15 Python
jupyter notebook 恢复误删单元格或者历史代码的实现
2020/04/17 Python
html5使用canvas实现图片下载功能的示例代码
2017/08/26 HTML / CSS
Pedro官网:新加坡时尚品牌
2019/08/27 全球购物
中职生自我鉴定范文
2013/10/03 职场文书
个人能力自我鉴赏
2014/01/25 职场文书
班班通项目实施方案
2014/02/25 职场文书
英语自我介绍演讲稿
2014/09/01 职场文书
大学团日活动新闻稿
2014/09/10 职场文书
nginx搭建图片服务器的过程详解(root和alias的区别)
2021/03/31 Servers