<!DOCTYPE HTML>

<html>

<head>

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

<title>自己定义点标记图标</title>

<link rel="stylesheet" type="text/css" href="http://developer.amap.com/Public/css/demo.Default.css" />

<!-- 这里的key值须要到http://lbs.amap.com/api/javascript-api/summary-3/这个网址里申请，在左下角的为位置-->

<script language="javascript" src="http://webapi.amap.com/maps?

v=1.3&key=你申请的key值"></script>

<script language="javascript">

var mapObj,marker;

//初始化地图对象，载入地图

function mapInit(){

    mapObj = new AMap.Map("iCenter",{

        //二维地图显示视口

        view: new AMap.View2D({

            center:new AMap.LngLat(116.397428,39.90923),//地图中心点

            zoom:4 //地图显示的缩放级别

        })

    });

    //加入点标记。并使用自己的icon

    addMarker1();

    addMarker2();

}

//在地图上加入点标记函数

function addMarker1(){

    marker=new AMap.Marker({

    icon:new AMap.Icon({    //复杂图标

            size:new AMap.Size(25,25),//图标大小

            image:"chinaz12.png", //大图地址

            imageOffset:new AMap.Pixel(0,0)//相对于大图的取图位置

        }),

    position:new AMap.LngLat(116.405467,39.907761)

    });

    marker.setMap(mapObj);  //在地图上加入点

    //信息载体

    var info = [];

    info.push("<b>  高德软件</b>");

    info.push("  电话 :  010-84107000   邮编 : 100102");

    info.push("  地址 : 北京市望京阜通东大街方恒国际中心A座16层");                 

    var inforWindow = new AMap.InfoWindow({

      offset:new AMap.Pixel(0,-25),

      content:info.join("<br>")

    });  

    //监听事件

    AMap.event.addListener(marker,"click",function(e){

      inforWindow.open(mapObj,new AMap.LngLat(116.405467,39.907761));

    });

}

//在地图上加入点标记函数

function addMarker2(){

    marker=new AMap.Marker({

    icon:new AMap.Icon({    //复杂图标

            size:new AMap.Size(25,25),//图标大小

            image:"chinaz12.png", //大图地址

            imageOffset:new AMap.Pixel(0,0)//相对于大图的取图位置

        }),

    position:new AMap.LngLat(120.343234,30.31162)

    });

    marker.setMap(mapObj);  //在地图上加入点

    //信息载体

    var info = [];

    info.push("<b>  杭州电子科技大学</b>");

    info.push("  电话 :  010-84107000   邮编 : 100102");

    info.push("  地址 : 北京市望京阜通东大街方恒国际中心A座16层");                 

    var inforWindow = new AMap.InfoWindow({

      offset:new AMap.Pixel(0,-25),

      content:info.join("<br>")

    });  

    //监听事件

    AMap.event.addListener(marker,"click",function(e){

      inforWindow.open(mapObj,new AMap.LngLat(120.343234,30.31162));

    });

}

</script>

</head>

<body onLoad="mapInit()">

    <div id="iCenter"></div>

</body>

</html>

版权声明：本文博主原创文章，博客，未经同意不得转载。

在高德地图应用api，和api展出的标记小的应用程序的更多相关文章

  1. 高德地图车机版API演示程序

    高德地图车机版API演示程序 做车载的应该和这个程序打交道打的比较多吧,这里是我今天写的一个实现了他的API的一个演示程序 首先我们来看下他的官网. http://lbs.amap.com/api/a ...

  2. 高德地图 Android编程中 如何设置使 标记 marker 能够被拖拽

    由于本人对智能手机真心的不太会用,我本人大概是不到3年前才买的智能手机,用以前的索尼爱立信手机比较方便小巧,平时学习工作打个电话发个短信也就够了,出去吃饭一般都是朋友拿手机去弄什么美团团购啥的,然后我 ...

  3. 【python】获取高德地图省市区县列表

    项目中需要用省市区来进行检索,原想高德地图肯定会有API来获得这些数据,结果没有找到,有一个接口好像可以用,但是会附带大量的边界坐标点. 所以就不如自己把高德的省市区列表扒下来,自己写接口来完成这个功 ...

  4. 实例源码--Android高德地图实例源码

      下载源码 技术要点: 1.高德地图 API的使用 2.定位 ,查询路线,公交查询等地图相关技术 3.源码带有非常详 细的中文注释 ...... 详细介绍:  1. 高德地图API的使用 本套实例采 ...

  5. OpenERP|ODOO高德地图应用

    发布时间:2015-04-06 11:01:37来源:http://www.chinamaker.net 在openerp中的fleet模块,每一个车辆都有地图应用.默认采用的是谷歌地图,但是在应用得 ...

  6. Android 高德地图使用小记

    感谢大佬:https://www.cnblogs.com/devilmaycry812839668/p/8727569.html 高德地图 Android编程中 如何设置使 标记 marker 能够被 ...

  7. 如何实现在H5里调起高德地图APP？（上）

    这一篇文章,将讲述如何在H5里调起高德地图APP,并展示兴趣点.适合于展示某个餐馆,商场等,让用户自行选择前往方式. 场景一.在高德地图上展示Marker点或者POI标记 在一些基于位置分享的应用开发 ...

  8. 如何实现在H5里调起高德地图APP？

    http://www.cnblogs.com/milkmap/p/5912350.html 这一篇文章,将讲述如何在H5里调起高德地图APP,并展示兴趣点.适合于展示某个餐馆,商场等,让用户自行选择前 ...

  9. 高德地图api实现地址和经纬度的转换(python)

    利用高德地图web服务api实现地理/逆地址编码 api使用具体方法请查看官方文档 文档网址:http://lbs.amap.com/api/webservice/guide/api/georegeo ...

随机推荐

  1. SE 2014年5月9日

    两企业接入到 Internet(A公司和B公司),企业内部的用户及服务器均能够访问到 Internet. 2. A公司规模较大,采用了接入层/汇聚层/核心层的划分模式,接入层划分了多vLan(如图), ...

  2. 关于Opencv2.4.x中stitcher类的简单应用

    1.opencv2.4以上版本有stitcher类,可以简单方便的实现图像的拼接,目前只是简单的测试一下stitcher类的拼接功能,也是纠结了好长时间,最终发现是要在链接库中加上opencv_sti ...

  3. UpdatePanel Repeater内LinkButton造成页面刷新问题

    本意:UpdatePanel1内嵌的Repeater1中带有LinkButton1, 将由LinkButton1触发页面的UpdatePanel2更新,而不需要更新UpdatePanel1,当然也不需 ...

  4. hdu4126（最小生成树+dfs）

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4126 题意:给出一幅3000个点的图,有10000次操作: 求将某条边的权值变大后的最小生成树,最后输 ...

  5. 【android】在Eclipse在联想引jar包源代码

    (前提是你有jar包源代码!!) .确保Referenced LIbraies下已经有该jar包,否则的话,右击该jar包选build path->add to build path. 二.右键 ...

  6. sql小技巧 group by datetime类型字段，只取其中的日期部分

    工作中经常会遇到,要在sql中查询报表,查询结果要求按照日期来罗列, 或按照天, 或按照月,年. 这个时候我们经常会苦恼,datetime是精确到毫秒的,如果单纯的group by datetime就 ...

  7. cocos2d-x 精灵的创建和基本使用

    在cocos2d-x中.精灵能够说是一个最重要的组成元素,它代表游戏中一个最小的可见单位.同一时候也是CCNode一个最为灵活的子类,由于它能够通过装载一个平面纹理,从而具有丰富的表现力. 在进一步说 ...

  8. Google 开源项目的风格指南

    谷歌C++代码风格指南.农业所需的代码.更难得的是不FQ,决定性的最爱!! . http://zh-google-styleguide.readthedocs.org/en/latest/google ...

  9. 企业邮件系统-Postfix安装使用

    Postfix是目前流行的一套邮件传输代理软件(MTA),其作者Wietst Venema最初开发这套软件时就对总体设计.扩展能力.可用性及系统安全等方面进行了充分的考虑.由于Postfix在稳定.效 ...

  10. Linux安装jdk 8和环境变量配置

    1.下载jdk 地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 2.将刚刚 ...