(→附近检索组件) |
(→附近检索组件) |
||
(未显示1个用户的2个中间版本) | |||
第5行: | 第5行: | ||
'''地图方式代码片段如下:''' | '''地图方式代码片段如下:''' | ||
− | < | + | <source> |
+ | |||
<lbs-nearby enable-geo="true" city="北京" num="10" query="美食" radius="5000" type="map" style="height:100%" sort=”price” center=”12961340.92,4823546.32”></lbs-nearby> | <lbs-nearby enable-geo="true" city="北京" num="10" query="美食" radius="5000" type="map" style="height:100%" sort=”price” center=”12961340.92,4823546.32”></lbs-nearby> | ||
− | </ | + | |
+ | </source> | ||
其中, | 其中, | ||
第27行: | 第29行: | ||
sort 表示排序方式,其中price指价格从低到高,distance指距离从进到远(需要center 或者开启geo),groupon表示团购优先 | sort 表示排序方式,其中price指价格从低到高,distance指距离从进到远(需要center 或者开启geo),groupon表示团购优先 | ||
− | + | center 表示检索中心,如果想启用center,请将 enable-geo设为false,或者取消该属性。 | |
+ | |||
+ | |||
+ | 修改后刷新界面的属性:city,num,type,query,sort,radius,center | ||
第49行: | 第54行: | ||
'''完整代码参考:''' | '''完整代码参考:''' | ||
− | < | + | <source> |
<html> | <html> | ||
第65行: | 第70行: | ||
</html> | </html> | ||
− | </ | + | </source> |
2015年1月16日 (五) 18:10的最后版本
附近检索组件
附近检索组件实现展示周边一定范围内指定poi数据的功能,有地图和列表两种展示方式。
地图方式代码片段如下:
<lbs-nearby enable-geo="true" city="北京" num="10" query="美食" radius="5000" type="map" style="height:100%" sort=”price” center=”12961340.92,4823546.32”></lbs-nearby>
其中,
lbs-nearby表示地图附近检索标签;
enable-geo表示启动定位功能,启动定位后会以定位点为中心点坐标进行检索;
city表示检索城市;
num表示显示的检索结果条数;
query表示检索关键字;
radius表示周边检索的检索半径;
type表示是进图区还是列表页,其中map指图区,list指列表。
sort 表示排序方式,其中price指价格从低到高,distance指距离从进到远(需要center 或者开启geo),groupon表示团购优先
center 表示检索中心,如果想启用center,请将 enable-geo设为false,或者取消该属性。
修改后刷新界面的属性:city,num,type,query,sort,radius,center
实现的效果如下:
点击面板里的“到这里”会进入webapp版百度地图的线路查询(见下图),点击电话按钮可以拨打商家电话:
将type值改成list,得到检索列表效果如下:
点击列表里的数据会进入webapp百度地图的详情页面:
完整代码参考:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <title>附近检索组件</title> <script src="http://api.map.baidu.com/components?ak=yourak&v=1.0"> </script> </head> <body> <!—附近检索组件--> <lbs-nearby enable-geo="true" city="北京" num="10" query="美食" radius="5000" type="map" style="height:100%"></lbs-nearby> </body> </html>