zoukankan      html  css  js  c++  java
  • 百度地图API--信息窗口

    信息窗口

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

    /*
    	 * 添加纯文本信息窗口
    	 */
    	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); 
    		});
    }
  • 相关阅读:
    MapReduce学习总结之简介
    Hive Cli相关操作
    使用Hive UDF和GeoIP库为Hive加入IP识别功能
    Google Maps-IP地址的可视化查询
    hive多表联合查询(GroupLens->Users,Movies,Ratings表)
    云计算平台管理的三大利器Nagios、Ganglia和Splunk
    机器大数据也离不开Hadoop
    hive与hbase的整合
    hive优化之------控制hive任务中的map数和reduce数
    Hadoop管理员的十个最佳实践(转)
  • 原文地址:https://www.cnblogs.com/lvlina/p/6098439.html
Copyright © 2011-2022 走看看