<!DOCTYPE html>

<html>

<head>

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

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

    <style type="text/css">

    body, html{width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}

    #allmap {height: 600px;width:100%;overflow: hidden;}

    #result {width:100%;font-size:12px;}

    dl,dt,dd,ul,li{

        margin:0;

        padding:0;

        list-style:none;

    }

    dt{

        font-size:14px;

        font-family:"微软雅黑";

        font-weight:bold;

        border-bottom:1px dotted #000;

        padding:5px 0 5px 5px;

        margin:5px 0;

    }

    dd{

        padding:5px 0 0 5px;

    }

    li{

        line-height:28px;

    }

    </style>

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=QfT1nxn0agjht4lGTgCfV4zD"></script>

    <script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>

    <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />

    <title></title>

</head>

<body>

    <div id="allmap">

    </div>

</body>

</html>

文内JS代码（博文中不能带script标签）：

// 百度地图API功能

    var map = new BMap.Map('allmap');

    var poi = new BMap.Point(${bean.dictionaryExt.string1});

    map.centerAndZoom(poi, 16);

    map.enableScrollWheelZoom();

    var content = '<div style="margin:0;line-height:20px;padding:2px;">' +

    				'县  市  区：${bean.dictionaryExt.name} <br/>'+

                    //'<img src="../img/baidu.jpg" alt="" style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>' +

                    '地        址：${bean.defaultValue}<br/>'+

                    '服务时间：${bean.dictionaryExt.description} <br/>'+

                    '电        话：${bean.dictionaryExt.string2!?html}' +

                  '</div>';

    //创建检索信息窗口对象

    var searchInfoWindow = null;

	searchInfoWindow = new BMapLib.SearchInfoWindow(map, content, {

			title  : "XXXX",      //标题

			width  : 290,             //宽度

			height : 105,              //高度

			panel  : "panel",         //检索结果面板

			enableAutoPan : false,     //自动平移

			searchTypes   :[

				BMAPLIB_TAB_SEARCH,   //周边检索

				BMAPLIB_TAB_TO_HERE,  //到这里去

				BMAPLIB_TAB_FROM_HERE //从这里出发

			]

		});

    var marker = new BMap.Marker(poi); //创建marker对象

    //marker.enableDragging(); //marker可拖拽

    marker.addEventListener("click", function(e){

	    searchInfoWindow.open(marker);

    })

    map.addOverlay(marker); //在地图中添加marker

　　

附：百度地图坐标拾取

百度地图HTML接口的更多相关文章

  1. WebApiClient百度地图服务接口实践

    1. 文章目的 随着WebApiClient的不断完善,越来越多开发者选择WebApiClient替换原生的HttpClient,然而在应用到实际项目中多多少少会遇到一些项目结合上的疑问和困难,本文将 ...

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

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

  3. Angular 调用百度地图API接口

    Angular 调用百度地图API接口 参考原文:https://blog.csdn.net/yuyinghua0302/article/details/80624274 下面简单介绍一下如何在Ang ...

  4. httpclient案例二（调用百度地图的接口）

    一,class T package com.http.test; import org.junit.Test; import com.http.BaiduMapProxyService; import ...

  5. tp5 封装百度地图api接口

    //服务器端api extend\Map <?php /** * 百度地图业务封装 */ class Map{ /** * 根据地址来获取经纬度 * @param $address */ pub ...

  6. vue框架导入百度地图API接口的方法

    百度请求API接口:

  7. 百度地图API接口

    js <script type="text/javascript"> // 百度地图API功能 var map = new BMap.Map("map&quo ...

  8. 用户Ip地址和百度地图api接口获取用户地理位置（经纬度坐标，城市）

    <?php   //获取用户ip(外网ip 服务器上可以获取用户外网Ip 本机ip地址只能获取127.0.0.1) function getip(){     if(!empty($_SERVE ...

  9. 使用百度地图api接口获取公交地图路线和车站

    需要在页面文件中引用百度的js @*<script type="text/javascript" src="http://api.map.baidu.com/api ...

随机推荐

  1. XML预定义的实体

    在TSQL读取XML中一些特定的字符时出错,在XML中有些自付要用实体: 下面是五个在XML文档中预定义好的实体: < < 小于号 > > 大于号 & & 和  ...

  2. smarty练习： 设置试题及打印试卷

    数据库表格:shiti, shititimu, timu, kemu, xuanxiang 根据科目设置一个可以添加试题的页面:(如下图) 具体的题目从数据库中查出并形成一张试卷的形式 考试试题设置: ...

  3. CFLAGS/CPPFLAGS/CXXFLAGS in Makefile介绍

    先来看一张关于Makefile中的常见预定义变量. CFLAGS 表示用于 C 编译器的选项,CXXFLAGS 表示用于 C++ 编译器的选项.这两个变量实际上涵盖了编译和汇编两个步骤.大多数程序和库 ...

  4. Python新手学习基础之函数-return语句与函数调用

    return语句 return语句的写法是: return 表达式 return语句用于退出函数,选择性地向调用方返回一个表达式.return在不带参数的情况下,默认返回None. None是一个特殊 ...

  5. iOS中使用ZipArchive压缩和解压缩文件－备

    为什么我需要解压缩文件 有许多原因能解释为什么我要在工程中使用压缩和解压缩功能,下面是几个常见的原因: 苹果App Store的50M下载限制 苹 果公司出于流量的考虑,规定在非WIFI环境下,限制用 ...

  6. ubuntu安装openssh-server

    openssh-server是依赖于openssh-clienr的,那ubuntu不是自带了openssh-client吗? 原因是自带的openssh-clien与所要安装的openssh-serv ...

  7. ng-selected 与ng-options的使用

    1:ng-selected用在<option>标签上面,ng-options用在<select>上面,用于动态创建options列表. <form class=" ...

  8. ServletConfig对象 【通过此对象获取到web.xml中的信息】

    用途:       1)想让当前的Servlet读取一些在web.xml文件配置的初始化参数时,                      可以使用ServletConfig对象,他是Servlet运 ...

  9. 回收带Lob字段表占用的空间

    SQL> select object_name from user_objects; no rows selected SQL> select segment_name from user ...

  10. 【转】NPAPI 插件无法在 Chrome 42 版及更高版本上正常运行

    原文网址:https://support.google.com/chrome/answer/6213033 NPAPI 插件无法在 Chrome 42 版及更高版本上正常运行 您可以利用插件在浏览器中 ...