H5多媒体及案例、地理定位

今日目标

1.掌握多媒体标签video、audio
2.使用百度、高德地图api
3.独立完成视频播放、暂停、进度条【难点】

1.Web多媒体

1.1 video视频

属性	含义
autoplay	自动播放
muted	静音
loop	循环播放
duration	视频总时长
currentTime	当前播放时长

方法	含义
play()	播放
pause()	暂停

事件	含义
onplay	播放时触发
onpause	暂停时触发
onended	播放结束时触发

1.2 audio音频

属性	含义
autoplay	自动播放
muted	静音
loop	循环播放
duration	视频总时长
currentTime	当前播放时长

方法	含义
play()	播放
pause()	暂停

事件	含义
onplay	播放时触发
onpause	暂停时触发
onended	播放结束时触发

2.地图api

2.1 申请百度地图ak

1.百度一下 百度地图api
2.注册百度账号
3.申请百度地图开发者
4.控制台 => 应用管理 => 我的应用 => 创建应用 => 应用名，浏览器端，白名单（*） => 提交
ak--21OVHStFETx7zxLs7fUcTCiBFDG0qyMc

2.2 申请高德地图ak

1.百度一下 高德地图api
2.注册高德账号
3.申请高德地图开发者
4.控制台 => 应用管理 => 我的应用 => 创建应用 => 添加key，key名称，web端 => 提交
ak--2b0713524aa77df020120900a334f4bc

2.3 百度地图基本使用

	1.百度一下 百度地图api
	2.开发文档 => JavaScriptApi => 示例Demo => 选一个喜欢的cv => 加上自己的ak => 修改部分细节参数
	3.坐标拾取系统：https://api.map.baidu.com/lbsapi/getpoint/index.html

2.4 高德地图基本使用

	1.百度一下 高德地图api
	2.开发支持 => 地图JSApi => 示例中心 => 选一个喜欢的cv => 加上自己的ak => 修改部分细节参数