前言

之前项目有个需求,在网页上显示微信发送过来的位置信息,该开始想用百度地图,后来发现腾讯地图相对简单一点

快速入门

申请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快速入门的更多相关文章

  1. # 初体验之腾讯位置服务彩云天气开发者api

    初体验 最近接触到了boxjs,看到了里面一个比较有意思的彩云天气的脚本,由于自己本身就是彩云天气pro的用户,日常使用过程中感觉到彩云的降雨提醒还是挺方便的,于是就准备开始使用这个天气的脚本. 脚本 ...

  2. Node.js API快速入门

    Node.js API 快速入门 一.事件EventEmitter const EventEmitter = require('events'); class MyEmitter extends Ev ...

  3. Html5 学习系列(五)Canvas绘图API快速入门(1)

    引言:Canvas绘图API快速入门 在接触HTML5的初学者包括我都在很多地方见到非常炫的一些页面,甚至好多学习HTML5的开发者都是冲着Web端的页游去的,那么HTML5那么绚丽的页面效果以及游戏 ...

  4. 引言:Canvas绘图API快速入门

    引言:Canvas绘图API快速入门 在接触HTML5的初学者包括我都在很多地方见到非常炫的一些页面,甚至好多学习HTML5的开发者都是冲着Web端的页游去的,那么HTML5那么绚丽的页面效果以及游戏 ...

  5. 集成腾讯位置服务到webapi

    经纬度转换为详细地址信息 参考文档:http://lbs.qq.com/webservice_v1/guide-gcoder.html 首先申请key,如果使用的是服务端请求webservice AP ...

  6. Html5 学习系列(五)Canvas绘图API快速入门(2)

    Canvas绘图API Demos 上一篇文章中,笔者已经给大家演示了怎么快速用Canvas的API绘制一个矩形出来.接下里我会在本文中给各位介绍Canvas的其他API:绘制线条.绘制椭圆.绘制图片 ...

  7. axis1.4开发webservice服务端(快速入门)-基于jdk1.4

    写在前面: 现在有很多开发webservice的方法以及框架,什么cxf等,但是这些在你编写服务类的时候都要用到注解这个功能.如果现在的jdk是1.4的,那么就不能使用注解这个功能了.所以这里可以用到 ...

  8. openstack api快速入门

    原文:http://my.oschina.net/guol/blog/105430 openstack官方有提供api供开发者使用,可以使用api做一些外围的小工具,用来简化对openstack的管理 ...

  9. 瓜娃《guava》api快速入门

    1,大纲 让我们来熟悉瓜娃,并体验下它的一些API,分成如下几个部分: Introduction Guava Collection API Guava Basic Utilities IO API C ...

随机推荐

  1. Storm 学习之路(二)—— Storm核心概念详解

    一.Storm核心概念 1.1 Topologies(拓扑) 一个完整的Storm流处理程序被称为Storm topology(拓扑).它是一个是由Spouts 和Bolts通过Stream连接起来的 ...

  2. Java学习笔记——设计模式之六.原型模式(浅克隆和深克隆)

    That there's some good in this world, Mr. Frodo. And it's worth fighting for. 原型模式(prototype),用原型实例指 ...

  3. Xmanager 5远程连接CentOS7图形化界面

    1.安装Xmanager 5下载链接:https://pan.baidu.com/s/1JwBk3UB4ErIDheivKv4-NA提取码:cw04 双击xmgr5_wm.exe进行安装 点击‘下一步 ...

  4. vSphere 5.5.0 U1配置问题:主机的快速统计信息不是最新的(转载)

    最近公司新购置了几台DELL服务器用来上桌面虚拟化,前期搭建测试环境进行功能验证,底层自然而然的选择VMware ESXi,当前最新版本为ESXi 5.5.0 U1,单独数据库安装,相对5.1来说,5 ...

  5. Codeforces 1133E - K Balanced Teams - [DP]

    题目链接:https://codeforces.com/contest/1133/problem/C 题意: 给出 $n$ 个数,选取其中若干个数分别组成 $k$ 组,要求每组内最大值与最小值的差值不 ...

  6. PHP弱类型总结

    0x01:“==”和“===” PHP中有两种比较符号,“==”与“===”.“==”我们称之为等值符,当等号两边为相同类型时,直接比较值是否相等:当等号两边类型不同时,先转换为相同的类型,再对转换后 ...

  7. ZooKeeper入门(四) Zookeeper监视(Watches)

    1 简介 Zookeeper 所有的读操作——getData(), getChildren(), 和 exists() 都 可以设置监视(watch),并且这些watch都由写操作来触发:create ...

  8. HDU 5527:Too Rich(DFS+贪心)***

    题目链接 题意 给出p块钱,现在要用十种硬币凑出,每种硬币有c[i]个,问最多能用多少个硬币. 思路 首先确定,对于每个硬币就是能用小的替换就不用大的. 所以,可以先把硬币尽量用小的替换,如果小的不够 ...

  9. Linux 提升逼格之 命令别名 分享

    1, 使用场景 Linux下开发 肯定是日常要用命令行的,命令行里包含了众多的命令和工具,例如: git.shell.以及一众系统命令等. 举个例子,码农最常用的 git add ,如果加上别名 可设 ...

  10. Jquery serialize()提交多个表单数据

    ajax提交多个表单数据: 先把不同的表单分别用serialize()函数,然后把序列化后的数据用+拼接提交给后台,具体例子如下 var data1 = $('#form1).serialize(); ...