第2讲地图覆盖物教学课件.ppt

高德LBS开放平台 第二讲：地图覆盖物 内容提要 覆盖物指南地址：/api/javascript-api/guide-2/overlay/ Marker 点标记 Polyline 折线 Polygon 多边形 Circle 圆 GroundImage 图片覆盖物 InfoWindow 信息窗体 覆盖物 Tip 先看开发指南的描述，覆盖物的用途 实例化对象通过设置map属性/setMap将覆盖物添加到图层，暂不包括InfoWindow 覆盖物API地址：/api/javascript-api/reference/overlay/ Marker 构建对象 方法 事件 代码演示 传入可选参数MarkerOptions: Map, position, offset, icon, content 初始化不传MarkerOptions: 使用set系列方法 setOffset / getOffset setPosition / getPosition setAngle / getAngle hide / show setContent / getContent setMap / getMap click mousemove dragend 创建1000个marker，并且添加到地图上 美团 去哪儿 阿里去啊 创建1个marker，设置不同的icon 创建一个自定的marker Polyline 构建对象 方法 事件 传入可选参数PolylineOptions: map, position, path, strokeStyle… 初始化不传PolylineOptions: 使用set系列方法 setPath / getPath getLength getBounds hide / show mouseover 绘制一条polyline 当鼠标经过时，触发事件 代码演示 Polygon、Circle、GroundImage原理都类似 InfoWindow 重要属性 方法 事件 isCustom、autoMove、content、size、offset、position closeWhenClickMap、showShadow open(map, position) close setContent getContent setSize / getSize Event: open、close 代码演示 创建一个infowindow 点击地图，infowindow消失 点击marker，infowindow弹出 利用坐标拾取工具，拾取点位信息，画出故宫的 大致范围； 2. 鼠标经过上面绘制的矩形，弹出InfoWindow。 故宫点的个数自拟；InfoWindow内容自拟。 如果实现了上面2个需求，欢迎同我们交流你的实现过程和方法： 鬼谣：lihua.wang@ 雨久：yewei.liu@ 思考：使用JS-API 需求 Thanks! * 代码演示 * 代码演示 * 代码演示 * 高德LBS开放平台 * 代码演示 * 代码演示 * 代码演示 *