腾讯位置服务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 Java API 的基本使用
一.简述 截至到目前(2019.04),HBase 有两个主要的版本,分别是1.x 和 2.x ,两个版本的Java API有所不同,1.x 中某些方法在2.x中被标识为@deprecated过时.所 ...
- tomcat实现
转载地址:https://blog.csdn.net/u014795347/article/details/52328221?locationNum=2&fps=1 以下代码纯属本人复制,而且 ...
- RobotFramework + HTTP接口自动化实现
一. 什么是自动化测试? 1. 定义 自动化测试是把以人为驱动的测试行为转化为机器执行的一种过程,也可以说是软件测试的一种技术手段. 2. 常见工具 Appium ...
- Jrebel激活服务搭建
前言 因为平时的开发工具是使用IntelliJ IDEA,所以热部署项目代码的时候,使用的Jrebel.因为Jrebel是收费的,所以以前用的时候都是在网上找破解方法(国人通用做法),在网上找到的办法 ...
- POJ 3301:Texas Trip(计算几何+三分)
http://poj.org/problem?id=3301 题意:在二维平面上有n个点,每个点有一个坐标,问需要的正方形最小面积是多少可以覆盖所有的点. 思路:从第二个样例可以看出,将正方形旋转45 ...
- sqlserver、oracle数据库排序空值null问题解决办法
转:https://www.cnblogs.com/pacer/archive/2010/03/02/1676371.html [sqlserver]: sqlserver 认为 null 最小. 升 ...
- 1.Solr安装与配置
1.Solr安装 1:安装 Tomcat,解压缩即可. 2:解压 solr. 3:把 solr 下的dist目录solr-4.10.3.war部署到 Tomcat\webapps下(去掉版本号). 4 ...
- Spring 核心技术(3)
接上篇:Spring 核心技术(2) version 5.1.8.RELEASE 1.4 依赖 典型的企业应用程序不会只包含单个对象(或 Spring 术语中的 bean).即使是最简单的应用程序也是 ...
- Android Native 内存泄漏系统化解决方案
导读:C++内存泄漏问题的分析.定位一直是Android平台上困扰开发人员的难题.因为地图渲染.导航等核心功能对性能要求很高,高德地图APP中存在大量的C++代码.解决这个问题对于产品质量尤为重要和关 ...
- golang http json http://www.alexedwards.net/blog/golang-response-snippets
http://www.alexedwards.net/blog/golang-response-snippets https://gist.github.com/andreagrandi/97263a ...