<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Hello world!</title>
<style type="text/css">
#container{
/*地图(容器)显示大小*/
width:1200px;
height:400px;
}
</style>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<!--引入Javascript API GL,参数说明参见下文-->
<!-- <script src="https://map.qq.com/api/gljs?v=1.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77"></script> -->
<!-- <script src="https://map.qq.com/api/gljs?v=1.exp&key=R6MBZ-ZVHKV-CHUPX-UR3BJ-5BDCS-5QFQV"></script> -->
<script type="text/javascript" src="https://3gimg.qq.com/lightmap/components/geolocation/geolocation.min.js"></script>
</head>
<!-- 页面载入后,调用init函数 -->
<body onload="initMap()">
<!-- 定义地图显示容器 -->
<!-- <div id="container"></div> -->
<p id="location"></p>
<p id="error"></p>
<script>
//地图初始化函数,本例取名为init,开发者可根据实际情况定义
var vConsole = new VConsole();
function initMap() {
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
function (position) {
// alert(position.coords.longitude);
// alert(position.coords.latitude);
console.log( position.coords.longitude );
console.log( position.coords.latitude );
},
function (e) {
throw(e.message);
}
)
} else {
console.log('浏览器不支持定位!');
}
//定义地图中心点坐标
// var center = new TMap.LatLng(39.984120, 116.307484)
// //定义map变量,调用 TMap.Map() 构造函数创建地图
// var map = new TMap.Map(document.getElementById('container'), {
// center: center,//设置地图中心点坐标
// zoom: 17.2, //设置地图缩放级别
// pitch: 43.5, //设置俯仰角
// rotation: 45 //设置地图旋转角度
// });
var geolocation = new qq.maps.Geolocation("R6MBZ-ZVHKV-CHUPX-UR3BJ-5BDCS-5QFQV", "myapp");
function onSuccess(res) {
console.log('res: ', res)
document.querySelector('#location').innerHTML = JSON.stringify(res);
}
function showErr(err, err1, err2) {
console.log('err: ', err, err1, err2)
document.querySelector('#error').innerHTML = JSON.stringify(res);
}
if (geolocation) {
var options = {timeout: 15000};
geolocation.getLocation(onSuccess, showErr, options);
} else {
errGoIndex("定位尚未加载");
}
}
</script>
</body>
</html>