腾讯位置服务API快速入门
前言
之前项目有个需求,在网页上显示微信发送过来的位置信息,该开始想用百度地图,后来发现腾讯地图相对简单一点
快速入门
申请Key
https://lbs.qq.com/guides/startup.html

引入js
<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=###"></script>
把###替换成你申请的key
定义容器
<div class="container" style='width:200px;height:200px'></div>
设置好宽高度
设置参数,初始化容器
var center = new qq.maps.LatLng(lat,lng);//lat:纬度 lng:经度(替换成你的经纬度)
var map = new qq.maps.Map($(".container"),{
center: center,
zoom: ,
zoomControl: false,
panControl: false
}); //设置标记
var marker = new qq.maps.Marker({
position:center, //设置Marker的位置坐标
map: map //设置显示Marker的地图
});
marker.setAnimation(qq.maps.MarkerAnimation.DOWN); //从天而降的标记
去掉腾讯地图LOGO
由于腾讯地图的LOGO太碍眼了,所以要干掉它
//去掉腾讯地图logo
$(".container").bind("DOMNodeInserted",function(e){
var tempCount = ;
$(".container .smnoprint").siblings().each(function(){
tempCount++;
if(tempCount== || tempCount==){
$(this).remove();
}
});
});
后记
官网上还给出了前端定位组件,能够更快的获取到你的位置
https://lbs.qq.com/tool/component-geolocation.html
腾讯位置服务API快速入门的更多相关文章
- # 初体验之腾讯位置服务彩云天气开发者api
初体验 最近接触到了boxjs,看到了里面一个比较有意思的彩云天气的脚本,由于自己本身就是彩云天气pro的用户,日常使用过程中感觉到彩云的降雨提醒还是挺方便的,于是就准备开始使用这个天气的脚本. 脚本 ...
- Node.js API快速入门
Node.js API 快速入门 一.事件EventEmitter const EventEmitter = require('events'); class MyEmitter extends Ev ...
- Html5 学习系列(五)Canvas绘图API快速入门(1)
引言:Canvas绘图API快速入门 在接触HTML5的初学者包括我都在很多地方见到非常炫的一些页面,甚至好多学习HTML5的开发者都是冲着Web端的页游去的,那么HTML5那么绚丽的页面效果以及游戏 ...
- 引言:Canvas绘图API快速入门
引言:Canvas绘图API快速入门 在接触HTML5的初学者包括我都在很多地方见到非常炫的一些页面,甚至好多学习HTML5的开发者都是冲着Web端的页游去的,那么HTML5那么绚丽的页面效果以及游戏 ...
- 集成腾讯位置服务到webapi
经纬度转换为详细地址信息 参考文档:http://lbs.qq.com/webservice_v1/guide-gcoder.html 首先申请key,如果使用的是服务端请求webservice AP ...
- Html5 学习系列(五)Canvas绘图API快速入门(2)
Canvas绘图API Demos 上一篇文章中,笔者已经给大家演示了怎么快速用Canvas的API绘制一个矩形出来.接下里我会在本文中给各位介绍Canvas的其他API:绘制线条.绘制椭圆.绘制图片 ...
- axis1.4开发webservice服务端(快速入门)-基于jdk1.4
写在前面: 现在有很多开发webservice的方法以及框架,什么cxf等,但是这些在你编写服务类的时候都要用到注解这个功能.如果现在的jdk是1.4的,那么就不能使用注解这个功能了.所以这里可以用到 ...
- openstack api快速入门
原文:http://my.oschina.net/guol/blog/105430 openstack官方有提供api供开发者使用,可以使用api做一些外围的小工具,用来简化对openstack的管理 ...
- 瓜娃《guava》api快速入门
1,大纲 让我们来熟悉瓜娃,并体验下它的一些API,分成如下几个部分: Introduction Guava Collection API Guava Basic Utilities IO API C ...
随机推荐
- Storm 学习之路(二)—— Storm核心概念详解
一.Storm核心概念 1.1 Topologies(拓扑) 一个完整的Storm流处理程序被称为Storm topology(拓扑).它是一个是由Spouts 和Bolts通过Stream连接起来的 ...
- Java学习笔记——设计模式之六.原型模式(浅克隆和深克隆)
That there's some good in this world, Mr. Frodo. And it's worth fighting for. 原型模式(prototype),用原型实例指 ...
- Xmanager 5远程连接CentOS7图形化界面
1.安装Xmanager 5下载链接:https://pan.baidu.com/s/1JwBk3UB4ErIDheivKv4-NA提取码:cw04 双击xmgr5_wm.exe进行安装 点击‘下一步 ...
- vSphere 5.5.0 U1配置问题:主机的快速统计信息不是最新的(转载)
最近公司新购置了几台DELL服务器用来上桌面虚拟化,前期搭建测试环境进行功能验证,底层自然而然的选择VMware ESXi,当前最新版本为ESXi 5.5.0 U1,单独数据库安装,相对5.1来说,5 ...
- Codeforces 1133E - K Balanced Teams - [DP]
题目链接:https://codeforces.com/contest/1133/problem/C 题意: 给出 $n$ 个数,选取其中若干个数分别组成 $k$ 组,要求每组内最大值与最小值的差值不 ...
- PHP弱类型总结
0x01:“==”和“===” PHP中有两种比较符号,“==”与“===”.“==”我们称之为等值符,当等号两边为相同类型时,直接比较值是否相等:当等号两边类型不同时,先转换为相同的类型,再对转换后 ...
- ZooKeeper入门(四) Zookeeper监视(Watches)
1 简介 Zookeeper 所有的读操作——getData(), getChildren(), 和 exists() 都 可以设置监视(watch),并且这些watch都由写操作来触发:create ...
- HDU 5527:Too Rich(DFS+贪心)***
题目链接 题意 给出p块钱,现在要用十种硬币凑出,每种硬币有c[i]个,问最多能用多少个硬币. 思路 首先确定,对于每个硬币就是能用小的替换就不用大的. 所以,可以先把硬币尽量用小的替换,如果小的不够 ...
- Linux 提升逼格之 命令别名 分享
1, 使用场景 Linux下开发 肯定是日常要用命令行的,命令行里包含了众多的命令和工具,例如: git.shell.以及一众系统命令等. 举个例子,码农最常用的 git add ,如果加上别名 可设 ...
- Jquery serialize()提交多个表单数据
ajax提交多个表单数据: 先把不同的表单分别用serialize()函数,然后把序列化后的数据用+拼接提交给后台,具体例子如下 var data1 = $('#form1).serialize(); ...