<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

    <title>Map</title>

    <script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp"></script>

    <script charset="utf-8" src="jquery-1.9.0.min.js"></script>

    <script>

var init = function() {

    var map = new qq.maps.Map(document.getElementById('container'));

    var myLatLng = new qq.maps.LatLng(39.916527,116.397128);

    map.panTo(myLatLng);

}

$(function(){

 // var map=new qq.maps.Map($('#container')[0]);//$('#container')是一个jQuery对象 这里需要的是DOM元素

 //    var myLatLng = new qq.maps.LatLng(39.916527,116.397128);

 //    map.panTo(myLatLng);

    var center = new qq.maps.LatLng(39.916527,116.397128);

    //第二种创建地图的方式

    var map = new qq.maps.Map($('#container')[0],{

        center: center,

        zoom: 13

    });

    var marker = new qq.maps.Marker({

        position: center,

        map: map

    });

    var info = new qq.maps.InfoWindow({

        map: map

    });

    qq.maps.event.addListener(marker, 'mouseover', function() {

        info.open();

        info.setContent('<div style="text-align:center;white-space:nowrap;'+

        'margin:10px;">hover标记</div>');

        info.setPosition(center);

    });

    qq.maps.event.addListener(marker, 'mouseout', function() {

        info.close();

    });

});

</script>

</head>

<body>

    <div id="container" style="width:500px; height:300px"></div>

</body>

</html>

腾讯地图之Marker的更多相关文章

  1. 地图API使用文档-以腾讯地图为例

    目录 腾讯地图API 2 1.API概览... 2 1.1 WebService API(官网注明是beta版本,可能不稳定,慎用):... 2 1.2 URL API:... 2 1.3 静态图AP ...

  2. 腾讯地图JS API实现带方向箭头的线路Polyline

    最近产品提出一个需求,在我们使用的腾讯地图上为线路polyline添加线路方向.例如下图所示: 查找腾讯地图JS API提供的API,没有找到对应的支持,询问负责腾讯地图的人也得到了同样的答案,即地图 ...

  3. 高德地图添加marker及反地理编码获取POI

    项目中集成百度.高德.腾讯地图已是司空见惯的事情,今天我总结了一下项目中用到的高德地图常用的功能: 1.展示高德地图并定位显示定位图标: 2.添加实时大头针: 3.反地理编码获取周围兴趣点 效果如下: ...

  4. Xamarin.Forms 调用 腾讯地图SDK

    Xamarin.Forms研究了好一段时间了,最近一直在学习中,想尝试一下调用其他的SDK,就如腾讯地图SDK(申请容易). 完成此次项目得感谢以下链接: http://www.cnblogs.com ...

  5. H5端调起百度地图、腾讯地图app

    来自一个需求的总结: 在微信公众号中根据地图上的marker和label,或者搜索结果点击调起地图APP进行导航. 一开始是使用百度地图进行开发,后面转腾讯是因为微信不允许不是自家或者合作方的APP在 ...

  6. 腾讯地图JSAPI开发demo 定位，查询

    1.IP定位切换 2.点击坐标获取地点 3.查询地点切换坐标 <!DOCTYPE html> <html> <head> <meta http-equiv=& ...

  7. H5调用腾讯地图

    获取当前定位的经纬度并在容器内显示当前位置 (安卓上的位置有点偏差) 在vue的index.html中需要引用 template <div id="container" st ...

  8. wx地址和腾讯地图

    如果只是要获取当前用户的经纬度和打开微信自带的地图 只需要 jsApiList: ["getLocation","openLocation"] // 先获得 w ...

  9. uniapp H5引入腾讯地图

    在网上搜索了许多关于uniapp引入腾讯地图的方法都以失败告终,我开发的应用主要使用于H5,小程序与H5是不同的sdk,就不在这说了,况且小程序有手把手教学,可参考腾讯地图官网https://lbs. ...

随机推荐

  1. BZOJ 1037 [ZJOI2008]生日聚会Party（单调DP）

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1037 [题目大意] 现在有n个男生,m个女生排成一行,要求不存在一个区间男女之差大于k ...

  2. 超高性价比USB转CAN适配器，2500V工业级隔离，兼容ZLG软件

    淘宝链接: http://item.taobao.com/item.htm?spm=a230r.1.14.16.QGsAZg&id=20134109594&initiative_new ...

  3. UIImageView图片视图的基本概念和使用方法

    IOS学习笔记(十)之UIImageView图片视图的基本概念和使用方法(博客地址: http://blog.csdn.net/developer_jiangqq ) Author:hmjiangqq ...

  4. /etc/ld.so.conf详解

    /etc/ld.so.conf 此文件记录了编译时使用的动态库的路径,也就是加载so库的路径.    默认情况下,编译器只会使用/lib和/usr/lib这两个目录下的库文件,而通常通过源码包进行安装 ...

  5. Asp.net 提供程序模型

    需要说明一下几点 1.什么是提供程序? 2.ASP.NET 4.5 中的提供程序 3.配置提供程序 有一下几种存储状态的方式 1.应用程序状态 2.会话状态 3.高速缓存状态 4.cookie 5.查 ...

  6. 关于iOS8上本地通知接收不到的问题

    在iOS8系统开发使用本地通知时,会出现如下的相关提示语: 1 Attempting to schedule a local notification2 with an alert but haven ...

  7. Java学习之finally

    如果catch中有return语句,finally里面的语句还会执行吗? 会执行,在return语句的中间执行 public class Test{ public static void main(S ...

  8. pure学习笔记

    最近研究Pure,发现这个对于写css来说确实是个好的框架,特此总结了一番,如有错误或不足的地方,欢迎交流指点,轻拍. 此文运用的是优雅的Markdown而书 Pure学习笔记 #写在最前 1# Pu ...

  9. mysql中varchar最长多少

    4.0版本以下,varchar(20),指的是20字节,如果存放UTF8汉字时,只能存6个(每个汉字3字节) 5.0版本以上,varchar(20),指的是20字符,无论存放的是数字.字母还是UTF8 ...

  10. spoj 375 QTREE - Query on a tree 树链剖分

    题目链接 给一棵树, 每条边有权值, 两种操作, 一种是将一条边的权值改变, 一种是询问u到v路径上最大的边的权值. 树链剖分模板. #include <iostream> #includ ...