腾讯位置服务JavaScript API 是由JavaScript语言开发的地图应用编程接口,在此基础上腾讯位置服务推出了其升级版JavaScript API GL,其基于WebGL实现的高性能三维渲染引擎而封装的一套3D版本地图API,3D化的视野更为自由,交互更加流畅。本文将展示如何使用腾讯位置服务JS API实现定位及地图标记的功能,并列举出打卡的开发示例。
1. 注册账号
a. 注册成为开发者
b. 申请密钥,在如图位置创建新密钥
c. 进行配置
推荐使用授权IP的方式进行配置,将你个人的IP写进输入框就OK啦!
2.使用官方Api进行地图标记(JavaScript)
2.1 通过搜索接口找到个人公司位置:
https://apis.map.qq.com/ws/place/v1/search?keyword=嘉誉国际&boundary=region(上海,0)&key=HLSBZ-T6JR5-BIEIW-QLJSF-ACEA3-*****
key换成你的
查询到公司位置为(31.329716,121.508386)
2.2 初始化地图,中心设为公司位置
<!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>
<!--引入Javascript API GL,参数说明参见下文-->
<script src="https://map.qq.com/api/gljs?v=1.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77"></script>
<script>
//地图初始化函数,本例取名为init,开发者可根据实际情况定义
function initMap() {
//定义地图中心点坐标
var center = new TMap.LatLng(31.329716, 121.508386);
//定义map变量,调用 TMap.