信息窗口

-----纯文本信息窗口 
为了更方便的提示用户,在地图的指定的地方添加文本信息的窗口,给用户直观展示信息,下面是如何添加一个纯文本的信息窗口。 
下面是添加一个文本窗口:

/*
* 添加纯文本信息窗口
*/
function addTextInfoWindow(map) {
var opts = {
width : 200, // 信息窗口宽度
height : 60, // 信息窗口高度
title : "西安美林电子有限责任公司", // 信息窗口标题
enableMessage : true,//设置允许信息窗发送短息
message : "欢迎来到西安美林电子有限责任公司就职..." // 信息内容
}
var infoWindow = new BMap.InfoWindow("地址:科技二路西安软件园汉韵阁C座501", opts); // 创建信息窗口对象
map.openInfoWindow(infoWindow, map.getCenter()); //开启信息窗口
}

-----复杂信息窗口

信息窗口不断能够展示纯文本的,还可以展示图片等复杂的信息,这样需要我们有一定的html基础,下面介绍如何添加一个复杂文本信息窗口。

/*
* 添加复杂信息窗口
*/
function addComplexInfoWindow(map) {
// 拼接html字符串
var sContent = "<h4 style='margin:0 0 5px 0;padding:0.2em 0'>汉韵阁</h4>"
+ "<img style='float:right;margin:4px' id='imgDemo' src='image/hyg.jpg' width='139' height='104' title='汉韵阁'/>"
+ "<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>汉韵阁坐落于西安软件园...</p>"
+ "</div>";
var marker = new BMap.Marker(map.getCenter());
var infoWindow = new BMap.InfoWindow(sContent); //创建信息窗口对象
map.addOverlay(marker);
marker.addEventListener("click", function() {
// 调用了marker对象的openInfoWindow方法
this.openInfoWindow(infoWindow);
});
}

百度地图API--信息窗口的更多相关文章

  1. 【百度地图API】建立全国银行位置查询系统(五)——如何更改百度地图的信息窗口内容?

    原文:[百度地图API]建立全国银行位置查询系统(五)--如何更改百度地图的信息窗口内容? 摘要: 酷讯.搜房.去哪儿网等大型房产.旅游酒店网站,用的是百度的数据库,却显示了自定义的信息窗口内容,这是 ...

  2. 在bootstrap modal 中加载百度地图的信息窗口失效解决方法

    这个问题其实很傻,解决方法没有任何技术含量,只是记录下工作中发生的事. 前阵子给一个汽车集团客户做了一个经销商查询系统,其中一个功能是使用地图标注经销商店面地址,并且实现导航功能. 页面演示地址:ht ...

  3. 百度地图API 批量添加 带检索功能的信息窗口

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. 百度地图api窗口信息自定义

    百度地图加载完后,完全可以用dom方法操作,比较常用的就是点击mark的弹窗,利用jQuery可以很快的创建弹窗,需要注意的就是地图都是异步加载,所以绑定时间要用 jQuery 事件 - delega ...

  5. 百度地图API显示多个标注点并添加百度样式检索窗口

    原作者博客地址:http://blog.csdn.net/a497785609/article/details/24009031 在此基础上进行了修改: 1.添加闭包,将i传入内部 2.添加地图和卫星 ...

  6. 百度地图API显示多个标注点带百度样式信息检索窗口的代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 百度地图api使用,简单搜索+经纬度定位+自定义消息窗口

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  8. 百度地图点击地图显示地址详情的默认方法怎么关闭,去掉百度地图api图标信息

    去掉百度地图api图标信息 调用百度地图API时,如果想去掉百度的logo,只需要在css里设置: <style> .anchorBL{display:none} </style&g ...

  9. 简单几行代码使用百度地图API接口分页获取信息

    首发于: 万能助手扩展开发:使用百度地图API接口分页获取信息_电脑计算机编程入门教程自学 http://jianma123.com/viewthread.aardio?threadid=426 使用 ...

  10. Android通过百度地图API用Service和Alarm在后台定时获取地理位置信息

    本文主要介绍了Android项目集成百度地图API,使用AlarmManager定时调用Service,在Service中请求坐标更新,并通过坐标得到省.市和县三级地理位置信息的方法. 程序结构很简单 ...

随机推荐

  1. CentOS配置DHCP服务器

    知识储备 bootp (boot protocol) 早前用于无盘工作站,dhcp的前身 IP初次分配完成,以后固定mac和IP绑定关系 dhcp基础 获取IP步骤 step1: Client dhc ...

  2. PHP的Trait机制

    PHP的Trait机制 Trait介绍: 1.自PHP5.4起,PHP实现了一种代码复用的方法,称为trait.2.Trait是为类似PHP的单继承语言二准备的一种代码复用机制.3.Trait为了减少 ...

  3. Activity 切换动画

    1,在AndroidManifest.xml中的Activity的声明上加入android:theme="@style/Anim_fade" <activity androi ...

  4. AC日记——[USACO08DEC]干草出售Hay For Sale 洛谷 P2925

    题目描述 Farmer John suffered a terrible loss when giant Australian cockroaches ate the entirety of his ...

  5. luogu P2912 [USACO08OCT]牧场散步Pasture Walking

    题目描述 The N cows (2 <= N <= 1,000) conveniently numbered 1..N are grazing among the N pastures ...

  6. kafka基础介绍

    kafka基础介绍 一.kafka介绍 1.1主要功能 根据官网的介绍,kafka是一个分布式流媒体的平台,它主要有三大功能: 1.11:It lets you publish and subscri ...

  7. VisualSVN Server 导入已存在的库

    http://blog.csdn.net/lidatgb/article/details/7984220         早些时候建立过一个SVN Server的库,后来觉得库的名字太长了,随意换了一 ...

  8. POJ3420 Quad Tiling DP + 矩阵高速幂

    题目大意是用1*2的骨牌堆积成4*N的矩形.一共同拥有多少种方法,N不超过10^9. 这题和以前在庞果网上做过的一道木块砌墙差点儿一样. 由于骨牌我们能够横着放.竖着放.我们如果以4为列,N为行这样去 ...

  9. mysql 安装与配置、使用

    http://www.cnblogs.com/shenliang123/p/3203546.html CentOs中mysql的安装与配置 在linux中安装数据库首选MySQL,Mysql数据库的第 ...

  10. 【读后感】Netty 系列之 Netty 高性能之道 - 相比 Mina 怎样 ?

    [读后感]Netty 系列之 Netty 高性能之道 - 相比 Mina 怎样 ? 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商 ...