第1行: | 第1行: | ||
{{subway-sidebar}} | {{subway-sidebar}} | ||
− | <div class="bluetitle"><div class=" | + | <div class="bluetitle"><div class="serve-explain-text"><div class="service-page-anchor"><span>简介</span></div></div></div><div class="serve-explain-text"> |
对于能够根据站点位置添加到地铁图中的元素我们统称为覆盖物。地铁图中所有的覆盖物都是和站点相关的。当您缩放和拖动地铁图时,覆盖物会相应的跟随站点移动。 | 对于能够根据站点位置添加到地铁图中的元素我们统称为覆盖物。地铁图中所有的覆盖物都是和站点相关的。当您缩放和拖动地铁图时,覆盖物会相应的跟随站点移动。 | ||
− | </div><!--jsapi-demo模板--><div class="jsapidemo_template"><!--展示地图区域--><div class="demo_area"><!--注释:默认展示效果(填写第一个按钮连接),避免延时--><div dir=" | + | </div><!--jsapi-demo模板--><div class="jsapidemo_template"><!--展示地图区域--><div class="demo_area"><!--注释:默认展示效果(填写第一个按钮连接),避免延时--><div dir="http://wiki.lbsyun.baidu.com/cms/jsapi/demo/addControl.html"></div></div><!--按钮区域--><div class="demo_control"><div class="demo_btn" style="width:50%;">[http://lbsyun.baidu.com/cms/jsapi/demo/jsapiSubway/subway2_0.html 站点标注]</div><div class="demo_btn" style="width:485px;">[http://lbsyun.baidu.com/cms/jsapi/demo/jsapiSubway/subway2_1.html 信息窗口]</div></div><!--右上角蓝色标签--可选--><div class="jsapi-demo-link">[http://lbsyun.baidu.com/jsdemo.htm#subway2_0 DEMO详情]</div></div><div class="bluetitle"><div class="services-title-text">提供的覆盖物</div></div><div class="serve-explain-text"> |
地铁图提供的覆盖物如下表。 | 地铁图提供的覆盖物如下表。 | ||
详情请见[http://lbsyun.baidu.com/cms/jsapi/reference/subway.html#a3b1 类参考]。</div> | 详情请见[http://lbsyun.baidu.com/cms/jsapi/reference/subway.html#a3b1 类参考]。</div> | ||
第19行: | 第19行: | ||
| 标识地铁图上的信息窗口,支持自定义信息窗口的内容和样式 | | 标识地铁图上的信息窗口,支持自定义信息窗口的内容和样式 | ||
|} | |} | ||
− | <div class="bluetitle"><div class=" | + | <div class="bluetitle"><div class="serve-explain-text"><div class="service-page-anchor"><span>标注点</span></div></div></div><div class="serve-explain-text"> |
Marker通常用来标注地铁图上的某个站点。API提供了默认样式,您也可以通过Icon类来自定义图标。 | Marker通常用来标注地铁图上的某个站点。API提供了默认样式,您也可以通过Icon类来自定义图标。 | ||
Marker使用详情请见[http://lbsyun.baidu.com/cms/jsapi/reference/lite.html#a3b1 类参考]。</div><div class="devguide"><div class="leftborderbg" style="height:5000px;"></div><div class="devguideorder"><span>1</span>向地铁图添加标注</div><div class="devguidecenter">新建一个Marker对象,配置icon为自定义的Icon对象,之后调用Subway.addMarker()方法把Marker添加到地铁图中:<pre class="prettyprint codestyle">var marker = new BMapSub.Marker('西直门', {icon: startIcon}); | Marker使用详情请见[http://lbsyun.baidu.com/cms/jsapi/reference/lite.html#a3b1 类参考]。</div><div class="devguide"><div class="leftborderbg" style="height:5000px;"></div><div class="devguideorder"><span>1</span>向地铁图添加标注</div><div class="devguidecenter">新建一个Marker对象,配置icon为自定义的Icon对象,之后调用Subway.addMarker()方法把Marker添加到地铁图中:<pre class="prettyprint codestyle">var marker = new BMapSub.Marker('西直门', {icon: startIcon}); | ||
第29行: | 第29行: | ||
); | ); | ||
</pre> | </pre> | ||
− | </div></div><div class="bluetitle"><div class=" | + | </div></div><div class="bluetitle"><div class="serve-explain-text"><div class="service-page-anchor"><span>信息窗口</span></div></div></div>div class="serve-explain-text"> |
InfoWindow通常用来标注地铁图上一些复杂信息。InfoWindow的DOM解构和CSS可以完全自定义。 | InfoWindow通常用来标注地铁图上一些复杂信息。InfoWindow的DOM解构和CSS可以完全自定义。 | ||
− | + | </div><div class="devguide"><div class="leftborderbg" style="height:5000px;"></div><div class="devguideorder"><span>1</span>定义InfoWindow对象</div><div class="devguidecenter"><pre class="prettyprint codestyle">var infowindow = new BMapSub.InfoWindow( | |
'<div id="bd-subwayInfo">' | '<div id="bd-subwayInfo">' | ||
+ '<div id="bd-subwayTitle">' | + '<div id="bd-subwayTitle">' |
2022年8月19日 (五) 14:26的最后版本
简介
对于能够根据站点位置添加到地铁图中的元素我们统称为覆盖物。地铁图中所有的覆盖物都是和站点相关的。当您缩放和拖动地铁图时,覆盖物会相应的跟随站点移动。
提供的覆盖物
地铁图提供的覆盖物如下表。
详情请见类参考。覆盖物 | 类名 | 说明 |
点 | Marker | 表示地铁图上的点,支持自定义图标 |
信息窗口 | InfoWindow | 标识地铁图上的信息窗口,支持自定义信息窗口的内容和样式 |
标注点
Marker通常用来标注地铁图上的某个站点。API提供了默认样式,您也可以通过Icon类来自定义图标。
Marker使用详情请见类参考。1向地铁图添加标注
新建一个Marker对象,配置icon为自定义的Icon对象,之后调用Subway.addMarker()方法把Marker添加到地铁图中:
var marker = new BMapSub.Marker('西直门', {icon: startIcon}); subway.addMarker(marker);
2自定义标注图标
var startIcon = new BMapSub.Icon( '[https://api.map.baidu.com/images/subway/start-bak.png https://api.map.baidu.com/images/subway/start-bak.png]', new BMapSub.Size(50, 80) );
信息窗口
InfoWindow通常用来标注地铁图上一些复杂信息。InfoWindow的DOM解构和CSS可以完全自定义。
</div>1定义InfoWindow对象
var infowindow = new BMapSub.InfoWindow( '<div id="bd-subwayInfo">' + '<div id="bd-subwayTitle">' + '西直门' + '</div>' + '</div>' );
2向地铁图添加信息窗口
使用Subway.openInfoWindow()方法,把信息窗口添加到地铁图中。其中,第一个参数为InfoWindow对象,第二个参数为要添加信息窗口的站点。
subway.openInfoWindow(infowindow, '西直门');