没有match的答案？试试对话大模型
（→定位组件） |
|||
| 第16行： | 第16行： | ||
'''利用定位组件获取定位点经纬度坐标代码段如下：''' | '''利用定位组件获取定位点经纬度坐标代码段如下：''' | ||
| − | < | + | <source> |
<lbs-geo id="geo" city="北京" enable-modified="false"></lbs-geo> | <lbs-geo id="geo" city="北京" enable-modified="false"></lbs-geo> | ||
| + | |||
<script> | <script> | ||
// 先获取元素 | // 先获取元素 | ||
| 第31行： | 第32行： | ||
var coords = evt.detail.coords; | var coords = evt.detail.coords; | ||
var x = coords.lng; | var x = coords.lng; | ||
| − | + | var y = coords.lat; | |
alert("地址："+address); | alert("地址："+address); | ||
alert("地理坐标："+x+','+y); | alert("地理坐标："+x+','+y); | ||
| − | + | }); | |
</script> | </script> | ||
| − | </ | + | </source> |
利用定位组件获取定位经纬度主要有以下两步： | 利用定位组件获取定位经纬度主要有以下两步： | ||
| 第56行： | 第57行： | ||
'''html代码片如下：''' | '''html代码片如下：''' | ||
| − | < | + | <source> |
| + | |||
<lbs-geo city="北京" enable-modified="false" show-ui="false"></lbs-geo> | <lbs-geo city="北京" enable-modified="false" show-ui="false"></lbs-geo> | ||
| − | </ | + | |
| + | </source> | ||
Script操作同上 | Script操作同上 | ||
| 第76行： | 第79行： | ||
'''完整代码请参考:''' | '''完整代码请参考:''' | ||
| − | < | + | <source> |
| + | |||
<html> | <html> | ||
<head> | <head> | ||
| 第101行： | 第105行： | ||
var coords = evt.detail.coords; | var coords = evt.detail.coords; | ||
var x = coords.lng; | var x = coords.lng; | ||
| − | + | var y = coords.lat; | |
alert("地址："+address); | alert("地址："+address); | ||
alert("地理坐标："+x+','+y); | alert("地理坐标："+x+','+y); | ||
| − | + | }); | |
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
| − | </ | + | |
| + | </source> | ||
2014年12月16日 (二) 16:44的版本
定位组件
利用定位组件开发者可以在自己的页面嵌入webapp百度地图样式的定位模块，且通过定位事件获取到定位点的经纬度坐标。
嵌入定位模块的代码片如下：
<lbs-geo city="北京" enable-modified="false"></lbs-geo>
运行效果如下：
利用定位组件获取定位点经纬度坐标代码段如下：
<lbs-geo id="geo" city="北京" enable-modified="false"></lbs-geo> <script> // 先获取元素 var lbsGeo = document.getElementById('geo'); //监听定位失败事件 geofail lbsGeo.addEventListener("geofail",function(evt){ alert("fail"); }); //监听定位成功事件 geosuccess lbsGeo.addEventListener("geosuccess",function(evt){ console.log(evt.detail); var address = evt.detail.address; var coords = evt.detail.coords; var x = coords.lng; var y = coords.lat; alert("地址："+address); alert("地理坐标："+x+','+y); }); </script>
利用定位组件获取定位经纬度主要有以下两步：
1. 首先获取到定位组件的DOM对象，我们这里通过ID来获取
2. 给定位组件DOM对象注册事件
定位组件UI的两种模式：
定位组件分为有UI和无UI两种模式，默认为有UI模式。
可以通过在<lbs-geo>标签设置”show-ui”属性选择是否有UI。
默认设置为true，有UI模式；设为false，则为无UI模式。
html代码片如下：
<lbs-geo city="北京" enable-modified="false" show-ui="false"></lbs-geo>
Script操作同上
定位组件修改定位结果：
如果希望修改定位结果，可以设置enable-modified="true" 运行效果如下：
点击“修改”可以重设当前定位结果。效果如下：
完整代码请参考:
<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-geo id="geo" city="北京" enable-modified="false"></lbs-geo> <script> // 先获取元素 var lbsGeo = document.getElementById('geo'); //监听定位失败事件 geofail lbsGeo.addEventListener("geofail",function(evt){ alert("fail"); }); //监听定位成功事件 geosuccess lbsGeo.addEventListener("geosuccess",function(evt){ console.log(evt.detail); var address = evt.detail.address; var coords = evt.detail.coords; var x = coords.lng; var y = coords.lat; alert("地址："+address); alert("地理坐标："+x+','+y); }); </script> </body> </html>