腾讯位置服务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 ...
随机推荐
- Hive 学习之路(五)—— Hive 分区表和分桶表
一.分区表 1.1 概念 Hive中的表对应为HDFS上的指定目录,在查询数据时候,默认会对全表进行扫描,这样时间和性能的消耗都非常大. 分区为HDFS上表目录的子目录,数据按照分区存储在子目录中.如 ...
- 【linux杂记】Ubuntu查看端口使用情况
转载地址: https://www.linuxidc.com/Linux/2016-01/127345.htm Ubuntu查看端口使用情况,使用netstat命令: 查看已经连接的服务端口(ESTA ...
- python 基本数据类型之整数和布尔值
#1. 当前整数的二进制表示,以最少位数 # age = # print(age.bit_length()) #2. 获取当前数据的字节表示 # age = # v = age.to_bytes(,b ...
- SQL Server温故系列(2):SQL 数据操作 CRUD 之简单查询
1.查询语句 SELECT 1.1.查询语句的 SELECT 子句 1.2.查询语句的 FROM 子句 1.2.1.内连接查询 INNER JOIN 1.2.2.外连接查询 OUTER JOIN 1. ...
- python数据库-安装问题总结(48)
一.ERROR1698(28000):Access denied for user root@localhost错误 我的操作系统是ubuntu: 我的MySQL版本是: 安装完成后,登录mysql的 ...
- 并发编程-concurrent指南-原子操作类-AtomicInteger
在java并发编程中,会出现++,--等操作,但是这些不是原子性操作,这在线程安全上面就会出现相应的问题.因此java提供了相应类的原子性操作类. 1.AtomicInteger
- HDU 6058:Kanade's sum(思维)
题目链接 题意 给出一个n和一个k,求1~n的每个区间的第k大的总和是多少,区间长度小于k的话,贡献为0. 思路 首先有一个关系:当一个数是第k大的时候,前面有x个比它大的数,那么后面就有k-x-1个 ...
- Codeforces 348B:Apple Tree(DFS+LCM+思维)
http://codeforces.com/contest/348/problem/B 题意:给一棵树,每个叶子结点有w[i]个苹果,每个子树的苹果数量为该子树所有叶子结点苹果数量之和,要使得每个结点 ...
- POJ 2887:Big String(分块)
http://poj.org/problem?id=2887 题意:给出一个字符串,还有n个询问,第一种询问是给出一个位置p和字符c,要在位置p的前面插入c(如果p超过字符串长度,自动插在最后),第二 ...
- .Net Core 创建和使用中间件
1. 定义中间内容 1.1 必须有一个RequestDelegate 委托用了进入一个中间件 1.2 通过构造函数设置这个RequestDelegate委托 1.3 必须有一个方法Task Invok ...