浏览器版本低!无法浏览完整内容,建议升级或更换浏览器。

文档全面上新

更科技的视觉体验,更高效的页面结构,快前往体验吧!

体验新版
 
第1行: 第1行:
 
{{subway-sidebar}}
 
{{subway-sidebar}}
<div class="bluetitle"><div class="services-title-text">简介</div></div><div class="serve-explain-text">
+
<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="https://lbsyun.baidu.com/cms/jsapi/demo/addControl.html"></div></div><!--按钮区域--><div class="demo_control"><div class="demo_btn" style="width:50%;">[//lbsyun.baidu.com/cms/jsapi/demo/jsapiSubway/subway2_0.html 站点标注]</div><div class="demo_btn" style="width:485px;">[//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">
+
</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="services-title-text">标注点</div></div><div class="serve-explain-text">
+
<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&nbsp;marker&nbsp;=&nbsp;new&nbsp;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&nbsp;marker&nbsp;=&nbsp;new&nbsp;BMapSub.Marker('西直门', {icon: startIcon});
第29行: 第29行:
 
);
 
);
 
</pre>
 
</pre>
</div></div><div class="bluetitle"><div class="services-title-text">信息窗口</div></div><div class="serve-explain-text">
+
</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&nbsp;infowindow&nbsp;=&nbsp;new&nbsp;BMapSub.InfoWindow(
+
&lt;/div&gt;<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&nbsp;infowindow&nbsp;=&nbsp;new&nbsp;BMapSub.InfoWindow(
 
'<div id="bd-subwayInfo">'
 
'<div id="bd-subwayInfo">'
 
+&nbsp;'<div id="bd-subwayTitle">'
 
+&nbsp;'<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)
);
信息窗口
div class="serve-explain-text">

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, '西直门');

  • 文档根本没法用

  • 文档水平很差

  • 文档水平一般

  • 文档不错

  • 文档写的很好

如发现文档错误,或对此文档有更好的建议,请在下方反馈。问题咨询请前往反馈平台提交工单咨询。

提交反馈

拖动标注工具

添加矩形标注

添加箭头标注

完成

取消