HTML5新特性

1.新的语义标签

2.表单2.0

3.视频和音频

4.Canvas绘图

5.SVG绘图

6.地理定位

7.拖放API

8.WebWorker

9.WebStorage

10.WebSocket

1.HTML5新特性——地理定位

地理定位:使用JS获取浏览器当前所在的地理坐标,实现LBS(Location Based Service,基于定位的服务),具体数据包括:

经度:longitude

纬度:latitude

海拔:altitude

速度:speed

技术上如何获取浏览器所在的定位信息:

(1)手机中的浏览器

靠手机内置的GPS芯片数据,精度在“米”级

靠手机与之通讯基站数据,精度在“公里”级

(2)PC中的浏览器

靠IP地址反向解析,精度在“公里”级

HTML5新增了用于获取浏览器所在定位的对象:

window.navigator.geolocation {

getCurrentPosition: fn 用于获取当前定位信息

watchPosition: fn 不停的监视定位信息的改变

clearWatch: fn 清除监视

}

navigator.geolocation.getCurrentPosition(

funcntion(pos){

console.log('定位成功');

}, function(err){

console.log('定位失败');

}

)

2.如何在页面中使用百度地图 —— 扩展小知识

从map.baidu.com下点击“地图开放平台”:

目前官网: http://lbsyun.baidu.com/

JS-API使用手册: http://lbsyun.baidu.com/index.php?title=jspopular

第三方工具的学习步骤:

(1)打开官网,找定义,功能说明

http://lbsyun.baidu.com/

可以基于百度地图进行Android、iOS、Web应用开发

http://lbsyun.baidu.com/index.php?title=jspopular

(2)找示例程序

(3)找API文档,编写自己的应用

3.使用百度地图API步骤:

(1)注册百度开发者账号

(2)使用开发者账号申请创建一个Web应用账号,获取一个访问百度地图的密钥(AccessKey)

http://lbsyun.baidu.com/apiconsole/key

(3)编写HTML网页,出示当前网站的访问密钥,调用百度地图API

//创建地图实例

var map = new BMap.Map();

//创建一个指定的点

var p = new BMap.Point(,);

//以指定点为中心显示地图

map.centerAndZoom(, );

html5新特性 gps,老生常谈H5新特性:地理定位相关推荐

  1. html5新特性表单控件,老生常谈h5新特性1:(表单)

    老生常谈h5新特性1:(表单) HTML5新特性 -- 十大新特性 (1)新的语义标签和属性 (2)表单新特性 (3)视频和音频 (4)Canvas绘图 (5)SVG绘图 (6)地理定位 (7)拖放A ...

  2. 【前端】【H5 API】地理定位(获取经纬度)

    H5 API 地理定位 地理定位在日常生活中应用比较广泛,例如,互联网打车.在线地图等.在HTML 5的规范中,增加了获取用户地理位置信息的接口Geolocation,开发者可以通过经纬度来获取用户的 ...

  3. 用html5做的柱状图,使用h5新特性canvas简单生成一个柱状图

    要展现一种数据,最直观的方式便是生成数据图,图例永远要比文字说明更加的清晰明了.因此,今天来生成一个利用canvas画布上的柱状图. 首先,先设置一个x,y轴,以便于柱状图的生成 var canvas ...

  4. Html5地理定位的使用

    一.定位基础与原理 1.IP定位(定位不准确) 通过电脑的IP地址,定位到当前的位置.但是我们平常拿到的IP地址,一般是运营商发布的公网IP,只有一些涉密机构,才能够通过与运行商协商,才能拿到具体的I ...

  5. 前端面试html5新特性,前端面试基础-html篇之H5新特性

    h用能境战求道,重件开又是正易里是了些之框5的新特性(目前个人所了解)如求圈分件圈浏第用代是水刚道.的它还下 语义化标签 表单新特性 视频(vi朋不功事做时次功好来多这开制的请一例农在deo)和音频( ...

  6. 前端16天--IFC、BFC、H5新特性、选择器、伪类元素、扩展盒模型、圆角、盒子阴影等--2021/4/21

    前端16天–IFC.BFC.H5新特性–2021/4/21 HTML5是HTML标准的最新演进版本: 1.是一个新的HTML语言版本包含了新的元素.属性和行为. 2.同时包含了一系列可以被用来让web ...

  7. 【面试】面试官:说一说H5新特性

    H5 新特性 1.拖拽释放(Drap and drop) API ondrop拖放是一种常见的特性,即抓取对象以后拖到另一个位置 在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放 2.自定义 ...

  8. H5新特性(一)——音视频标签

    H5新特性--音视频标签 大家都有在网页中浏览音频和视频的经历,在HTML5之前,对视频和音频没有一个标准,因此在网页中看到的视频,都是通过第三插件的方式嵌入的,可能是QuickTime,也可能是 R ...

  9. 前端面试题二:ES6/7/8新特性、性能优化、数据交互、H5新特性

    目录 一.ES6/7/8新特性 二.性能优化 三.数据交互 四.H5新特性 一.ES6/7/8新特性 1.ES6中新增了哪些数据类型? Symbol类型(基本) Set类型(复杂) Map类型(复杂) ...

最新文章

  1. 赋值、浅拷贝、深拷贝
  2. jieba如何空文本记录
  3. SQL Server数据库备份的镜像
  4. 基础练习 字母图形 c语言
  5. Linux虚拟机sqlite数据库安装教程、命令实现sqlite
  6. Angular添加class的正确方式
  7. API – MultiByteToWideChar的用法
  8. unserialize用法
  9. jsp获取连接池的实时连接数_一篇看懂数据库连接池概念、原理、运行机制
  10. python3一爬虫库url_python3爬虫之Urllib库(一)
  11. android学习笔记---31_多线程断点下载器,下载原理实现
  12. 让 WAS V6.1 的 JSP 编译器用 JDK5.0
  13. 20172330 2017-2018-1 《Java程序设计》第八周学习总结
  14. 20145202马超《java》实验5
  15. JavaSE基础笔记一
  16. nginx 内置变量大全
  17. 使用darknet批量测试图片并保存在指定文件夹下
  18. android 智能手机usb驱动程序,华为手机usb驱动下载
  19. 尾气冒黑烟是什么问题_汽车排气管冒黑烟,怎么回事?
  20. ROS学习(11)使用ROS创建地图

热门文章

  1. Charles SSL黑白名单
  2. 【项目精选】基于网络爬虫技术的网络新闻分析(论文+源码+视频)
  3. 【Go Web】Go对接华为云obs代码
  4. 亿级数据mysql优化
  5. 谈软件工程各环节中的辅助工具
  6. MySQL服务器安装(轻松带你安装)
  7. python处理两个Excel并且根据相同字段合并写入一个新的Excel
  8. JS与JQuery点击事件传递参数
  9. 使用Android RemoteCallbackList简化远端接口跨进程回调
  10. 中国气体插入市场趋势报告、技术动态创新及市场预测