基于HTML5 geolocation 实现的天气预报功能
最近一直在学习HTML5，因为8月份要开发手机项目了。所以先把HTML5学习下。
基本思路：
1. 用户未设置任何城市之前，根据HTML5 geolocation 获取用户所在的地理位置。
2. 根据用户设置的城市切换到所在城市的天气数据并展示之。
3. 根据当前城市的天气，展示近3天的天气情况。
从界面而言，基本上是仿百度小天气实现的，图片等也是在百度天气中下载到。天气的接口是调用的国家气象局提供的接口数据。
从程序来讲，里面使用了一个ajax.php文件，主要是用来根据城市名称获取天气的情况，并实现缓存天气数据。设置的是每隔4小时更新缓存（在用户访问界面后）。
先看看实现的效果：
说明一点：在运行时请使用支持HTML5的浏览器，才能查看到该效果。因为有PHP文件，所以必须在PHP环境下运行展示。
如果有遇到程序的问题，请给我留言，我会尽快处理。希望和大家共进步。
朋友们可以点击我的新站：http://www.webfxb.com/
基于HTML5 geolocation 实现的天气预报功能的更多相关文章
- 基于 html5 geolocation来获取经纬度地址(copy)
geolocation来获取经纬度地址 以前如果要获取互联网用户所在地都是根据用户的IP地址来获取地理位置,这样获取到的数据和真实数据有很大的偏差.为了获取更加精确的位置,可以使用了html5的geo ...
- HTML5 Geolocation 构建基于地理位置的 Web 应用
HTML5 中的新功能 HTML5 是最新一代的 HTML 规范,是 W3C 与 WHATWG 合作的结果,目前仍外于开发中.自从上一代 HTML4,Web 世界已经发生了巨大的变化,HTML5 的到 ...
- HTML5 Geolocation学习
GeolocationAPI学习,我写的挺枯燥的,直接跳到最后看示例. 5.1 位置信息 HTML5 Geolocation API的使用方法相当简单.请求一个位置信息,如果用户同意,浏览器就会返回位 ...
- [Javascript] HTML5 地理位置定位（HTML5 Geolocation）原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- HTML5 地理位置定位（HTML5 Geolocation）原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- html5 geolocation API
清单 1. 检查浏览器支持性if (navigator.geolocation) 清单 2. 单次定位请求 API void getCurrentPosition(updateLocation, op ...
- 快速开发基于 HTML5 网络拓扑图应用
采用 HT 开发网络拓扑图非常容易,例如<入门手册>的第一个小例子麻雀虽小五脏俱全:http://www.hightopo.com/guide/guide/core/beginners/e ...
- 基于HTML5 Canvas实现的图片马赛克模糊特效
效果请点击下面网址: http://hovertree.com/texiao/html5/1.htm 一.开门见山受美国肖像画家Chuck Close的启发,此脚本通过使用HTML5 canvas元素 ...
- 基于HTML5的Web SCADA工控移动应用
在电力.油田燃气.供水管网等工业自动化领域Web SCADA的概念已经提出了多年,早先年的Web SCADA前端技术大部分还是基于Flex.Silverlight甚至Applet这样的重客户端方案,在 ...
随机推荐
- Linux下chkconfig命令详解 这个简单明了啊
chkconfig命令主要用来更新(启动或停止)和查询系统服务的运行级信息.谨记chkconfig不是立即自动禁止或激活一个服务,它只是简单的改变了符号连接. 使用语法:chkconfig [--ad ...
- 常用Math 方法
/** * * @authors Your Name (you@example.org) * @date 2016-11-18 11:26:44 * @version $Id$ */ Math.pow ...
- SlickUpload Quick Start Guide
Quick Start Guide The SlickUpload quick start demonstrates how to install SlickUpload in a new or ex ...
- linux配置hosts
linux配置hosts linux下配置hosts和windows下其实就是一样的,找到文件在哪里就好 sudo vim /etc/hosts
- SQLServer清空数据库中所有的表并且ID自动归0
exec sp_MSforeachtable 'Truncate Table ?'
- WinRAR注册
新建一个txt文件并命名为"rarreg.key",添加以下内容保存,然后放置在WinRAR安装目录: RAR registration data Federal Agency f ...
- iOS苹果企业证书被撤销以及启用与管理
在国内, 积分墙以及各大助手(爱思助手, 91苹果助手, XY苹果助手, PP助手, 快用助手)等业务领域都在使用,苹果对证书的使用越来越严格.简单的分析一下,证书被封的原因. 一般证书被封会收到 ...
- poj 1905Expanding Rods
/* 二分 + 几何 弧长L, 圆半径R, 弧度 q, L=R*q; 二分: 弧度(0~PI) 或者 高度(L/2~L) */ #include<cstdio> #include<i ...
- java中Object.equals()简单用法
/* equals()方法默认的比较两个对象的引用! */ class Child { int num; public Child(int x){ num = x; } //人文的抛出运行时异常的好处 ...
- vs xamarin android StartActivity
跳转无需intent,直接给要跳转的activity的type就可以了 StartActivity(typeof(Login));