腾讯位置服务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 ...
随机推荐
- HBase 学习之路(四)—— HBase集群环境配置
一.集群规划 这里搭建一个3节点的HBase集群,其中三台主机上均为Regin Server.同时为了保证高可用,除了在hadoop001上部署主Master服务外,还在hadoop002上部署备用的 ...
- IDEA的参数配置
配置默认JDK 2.默认Project是没有JDK的,需要手动添加,然后才会有选项 关闭Intellij IDEA自动更新 文件编码设置 改快捷键,模板,注释,自动导包,创建web项目卡顿参数修改,代 ...
- 基于SpringBoot从零构建博客网站 - 开发设置主页标识和修改个人信息功能
由于守望博客系统中支持由用户自己设置个人主页的URL的后半段,所以必须要用户设置该标识的功能,而且是用户注册登录之后自动弹出的页面,如果用户没有设置该标识,其它的操作是不能够操作的,同时要求主页标识只 ...
- 对scanner.close方法的误解以及无法补救的错误
scanner错误关闭导致的异常 public class test2 { public static void main(String[] args) { Scanner scanner1 = ne ...
- vue组件间通信六种方式(完整版)
本文总结了vue组件间通信的几种方式,如props. $emit/ $on.vuex. $parent / $children. $attrs/ $listeners和provide/inject,以 ...
- Flutter学习笔记(8)--Dart面向对象
如需转载,请注明出处:Flutter学习笔记(7)--Dart异常处理 Dart作为高级语言,支持面向对象的很多特性,并且支持基于mixin的继承方式,基于mixin的继承方式是指:一个类可以继承自多 ...
- request 中url拼接排序参数与签名算法
一.参数要求: { appId:应用在后台创建应用时分配的应用编号,与应用密钥一一对应 sign:按照当前请求参数名的字母序进行升序排列(排序时区分大小写,除sign外,其它值不为空的参数都参与签名) ...
- WMI_COM_API
Win32_Processor // CPU 处理器 Win32_PhysicalMemory // 物理内存 Win32_Keyboard // 键盘 Win32_PointingDevice // ...
- [AOP拦截 ]SpringBoot+Quartz Aop拦截Job类中的方法
最近在工作使用boot+quartz整合,开发定时调度平台,遇到需要对Quartz的Job进行异常后将异常记录到日志表的操作,第一反应就想到了使用Spring的AOP,利用AfterThrowin ...
- c语言进阶13-线性表之顺序表
一. ACM算法:顺序表的查找 顺序表的查找指获取顺序表的第i个元素.对于线性表的顺序存储结构来说,如果我们要实现获取元素的操作(GetElem),即将线性表L中的第i个位置元素值返回.就程序而言,只 ...