<!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{width:100%;height:500px;}

        p{margin-left:5px; font-size:14px;}

    </style>

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

    <title>添加复杂内容的信息窗口</title>

</head>

<body>

<div id="allmap"></div>

</body>

</html>

<script type="text/javascript">

    // 百度地图API功能

    var sContent =

        "<h4 style='margin:0 0 5px 0;padding:0.2em 0'>服务热线</h4>" +

        "<img style='float:right;margin:4px' id='imgDemo' src='2.jpg' width='139' height='104' title='天安门'/>" +

        "<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>010-58405785</p>" +

        "</div>";

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

    var point = new BMap.Point(116.306406,40.049256);

    var marker = new BMap.Marker(point);

    var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象

    map.centerAndZoom(point, 25);

    map.addOverlay(marker);

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

        this.openInfoWindow(infoWindow);

        //图片加载完毕重绘infowindow

        document.getElementById('imgDemo').onload = function (){

            infoWindow.redraw();   //防止在网速较慢，图片未加载时，生成的信息框高度比图片的总高度小，导致图片部分被隐藏

        }

    });

</script>

百度api的使用的更多相关文章

  1. 百度API ； 很多有用的接口及公用 数据

    百度API : http://apistore.baidu.com/ . 比如手机号码:

  2. 去百度API的百度地图准确叠加和坐标转换的解决方案研究

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 目前项目上如果要使用百度地图,得加载百度的开发包,然后通过百 ...

  3. 利用百度API Store接口进行火车票查询

    火车票查询 项目源码下载链接: Github:https://github.com/VincentWYJ/TrainTicketQuery 博客文件:http://files.cnblogs.com/ ...

  4. 百度api短信开发

    公司原来有一个短信发送的功能,是调用第三方的,但是很不稳定,时不时就收不到短信,但是钱已经扣了.对于这样的事,谁都忍受不了的.于是想找一个稳定短信发送平台,第一想到的是阿里云,百度.在这两个平台上公司 ...

  5. html5获取经纬度，百度api获取街区名，并使用JS保存进cookie

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

  6. 百度API使用--javascript api进行多点定位

    使用百度地图提供的javascript api,给定多点的经纬度坐标,在百度地图上 显示这些坐标点. 其中包括各个点自适应地图显示,自定义坐标点的图标,以及各个点之间添加折线. 实现的效果如下图: 具 ...

  7. PHP学习笔记：利用百度api实现手机归属地查询

    从来没有用过api,都不知道怎么获得api的数据,跟着demo,然后修改,终于实现了手机号码查询的功能,代码和说明很全,大家试试. <?php /** * Created by jianqing ...

  8. 【百度地图API】百度API卫星图使用方法和卫星图对比工具

    原文:[百度地图API]百度API卫星图使用方法和卫星图对比工具 百度地图API推出卫星图接口也有一个月啦~ 本文除了介绍如何使用百度地图API来操作卫星图外,还顺带制作了个卫星图对比工具. 一.百度 ...

  9. 【转】百度API获取城市名地名(附源码)

    在做一个软件时,用到了定位功能.网上有很多关于google 的GPS定位,但网上关于google定位都没有用, 搜索下原因:(这里建议大家在中国就尽量不使用系统自带的定位) 因为Google的服务器不 ...

  10. HTML5根据浏览器获取经度和纬度（百度API）

    网页获取用户位置信息的办法1 调用百度地图的地图标注功能,通过百度地图API获取对应的经度和纬度进而获取地区信息 优点是比较准确,缺点是需要用户自己选择位置2 通过H5 geolocation属性获取 ...

随机推荐

  1. 2017<java技术>预备作业计科冀浩然

    1.阅读邹欣老师的博客,谈谈你期望的师生关系是什么样的? 我期望的师生关系是相互融洽的,老师能够在上课的时候尽量多的教我们专业知识,可以尽量多和我们进行互动,课下能和我们如同朋友一般就可以了. 2.你 ...

  2. HUST 1541 Student’s question

    1541 - Student’s question 时间限制:1秒 内存限制:128兆 696 次提交 134 次通过 题目描述 YYis a student. He is tired of calc ...

  3. UltraEdit的配置

    这两天看同学门写的博客,很多人都是些的配置文件如何配置,看完以后感觉获益很大啊,从dos中不在需要输入javac.exe文件的地址就可以访问到javac的文件,为我们的java的编译提供了很大的帮助. ...

  4. PHP面向对象——GD库实现图片水印和缩略图

    今天的实现目标就是使用GD库完成对图片加水印和图 片缩略图两个功能 动身前逻辑准备 属性: 路径 功能: 构造方法 生成水印的方法 获取 图片信息 获取位置信息(123 456 789) 创建图片资源 ...

  5. vs2010 入门程序

    #include <stdio.h> int main(){ printf("hello world!\n"); getchar(); //此处避免执行完程序自动退出 ...

  6. Win8下，以管理员身份启动VS项目

    之前一直是先以管理员身份启动VS,然后再打开项目的,比较麻烦,找了好久,总算有一个处理方案了 在Windows7下 通常使用修改属性的方式:在任意快捷方式上右击,选择属性,选择高级,选择以管理员身份启 ...

  7. Odoo安装

    打开终端机0. sudo passwd root #设定超级使用者密码1. sudo apt-get update #更新软件源2. sudo apt-get dist-upgrade #更新软件包, ...

  8. bugly集成了Tinker热更新

    介绍 热更新能力是Bugly为解决开发者紧急修复线上bug,而无需重新发版让用户无感知就能把问题修复的一项能力.Bugly目前采用微信Tinker的开源方案,开发者只需要集成我们提供的SDK就可以实现 ...

  9. Angular企业级开发(7)-MVC之控制器

    1.MVC中的控制器 AngularJS的控制器主要为了把模型和视图连接在一起.大多数业务逻辑操作都会放在视图对应的控制器中.当然如果我们能够把业务逻辑放到后端的REST服务中,就可以开发轻量级Ang ...

  10. node-webkit制作桌面应用

    心血来潮突然想用js尝试写桌面应用,突然发现我大js真的无所不能.在网上搜到了这么一个东东:node-webkit.用Node.js来进行系统资源的访问,用HTML+CSS完成页面的搭建.哇,一切突然 ...