按照惯例，先来一段"Hello World"级别的直观的效果

实现效果：

实现代码：

（WEB工程下直接运行即可）

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>百度GIS</title>

<script src="http://api.map.baidu.com/api?v=1.2"></script>

</head>

<body>

<div id="map" style="width:500px;height:320px;"></div>

<script>

    // 百度地图API功能，创建Map实例

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

    // 初始化地图,设置中心点坐标和地图级别

    map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);

    //添加地图类型控件

    map.addControl(new BMap.MapTypeControl({

        mapTypes:[

            BMAP_NORMAL_MAP,

            BMAP_HYBRID_MAP

        ]}));

    // 设置地图显示的城市

    map.setCurrentCity("北京");

    // 开启鼠标滚轮缩放

    map.enableScrollWheelZoom(true);

</script>

</body>

</html>

第一步：引入在线百度GIS API，版本：1.2，似乎1.4版本以上需要秘钥

第二步：设置一个div容器， 用来呈现地图，宽度和高度自定

第三步：在<script>里写JS代码控制地图

更多内容，参考官方：

http://developer.baidu.com/map/jsdemo.htm

百度GIS API使用的更多相关文章

  1. Java web与web gis学习笔记（二）——百度地图API调用

    系列链接: Java web与web gis学习笔记(一)--Tomcat环境搭建 Java web与web gis学习笔记(二)--百度地图API调用 JavaWeb和WebGIS学习笔记(三)-- ...

  2. 百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例 [源码下载]

    相关说明 1. 界面查看: 吐槽贴:百度地图 api 封装 的实用功能 [源码下载] 2. 功能说明: 百度地图整合功能分享修正版[ZMap.js] 实例源码! ZMap.js 本类方法功能大多使用 ...

  3. 深入浅出百度地图API开发系列（1）：前言

    百度地图API目前在地图API领域越来越受到众多开发者的关注,许多应用都使用到了百度地图API服务,包括博主me,我自己使用做的是Javascript API,根据经验,我想整理出一份系列教程,如果能 ...

  4. 关于百度地图API的地图坐标转换问题

    原文:关于百度地图API的地图坐标转换问题 我在之前的文章利用html5获取经纬度并且在百度地图中显示位置中使用了百度地图的API来显示html5获取的地理位置,在文中我说过这样的话,我说百度地图的准 ...

  5. 【百度地图API】建立全国银行位置查询系统（三）——如何在地图上添加银行标注

    原文:[百度地图API]建立全国银行位置查询系统(三)--如何在地图上添加银行标注 <摘要>你将在第三章中学会以下知识: 如何在地图上添加带银行logo的标注?(你也可以换成商场logo, ...

  6. 百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例

    百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例 相关说明 1. 界面查看: 吐槽贴:百度地图 api 封装 的实用功能 [源码下载] 2. 功能说明: 百度地图整合功能分享修 ...

  7. 百度地图api 区级以下行政区划

    我们在使用百度地图api想要展示苏州市吴中区各乡镇的行政区范围: 百度api有提供了“添加行政区划”的示例:http://lbsyun.baidu.com/jsdemo.htm#c1_10 但该功能目 ...

  8. 百度地图API的使用

    ------------------自说自话----------------------------- 好奇怪,习惯性使用有道云笔记记录心得与知识后就很少用博客园来记录了. 但是后来想想,有些东西还是 ...

  9. 吐槽贴：百度地图 api 封装 的实用功能 [源码下载]

    ZMap 类 功能介绍 ZMap 是学习百度地图 api 接口,开发基本功能后整的一个脚本类,本类方法功能大多使用 prototype 原型 实现: 包含的功能有:轨迹回放,圈画区域可编辑,判断几个坐 ...

随机推荐

  1. MYSQL的常用函数（字符串函数）

    ASCII(char)返回字符的ASCII码值 BIT_LENGTH(str)返回字符串的比特长度 CONCAT(s1,s2...,sn)将s1,s2...,sn连接成字符串 CONCAT_WS(se ...

  2. idea javamaven项目 连接sqlserver 数据库方法

    这里用的是c3p0连接数据库 1.pom文件写法: <!-- 数据库连接池 --> <dependency> <groupId>com.mchange</gr ...

  3. windows下开启端口映射配置办法

    #1.添加一个端口映射 netsh interface portproxy add v4tov4 listenaddress=大网IP listenport=端口  connectaddress=要映 ...

  4. bedtools神器 | gtf转bed | bed文件运算

    我们生信技能书有一篇介绍bedtools的文章,可以在微信里搜着看下,非常有用. http://bedtools.readthedocs.io/en/latest/ gtf转bed用Linux命令完全 ...

  5. js时间字符串转为标准时间

    //将字符串转换为时间格式,适用各种浏览器,格式如2016-09-09T17:02:37.227"function GetTimeByTimeStr(dateString) { var ti ...

  6. android -------- ConstraintLayout Guideline和Barrier（四）

    前面的文章 ConstraintLayout 介绍 (一) ConstraintLayout约束属性 (二) ConstraintLayout 宽高比和偏移量比(三) 此博文主要讲解:Guidelin ...

  7. android -------- 错误Attribute application@allowBackup value=(true) from AndroidManifest.xml

    开发中遇到一个问题,运行项目时,出现了一个这如下这样的问题 问题: Manifest merger failed : Attribute application@allowBackup value=( ...

  8. 最长回文字串——manacher算法

    时间复杂度:O(n) 参考:https://segmentfault.com/a/1190000003914228 1.问题定义 最长回文子串问题:给定一个字符串,求它的最长回文子串长度. 如果一个字 ...

  9. 『cs231n』通过代码理解风格迁移

    『cs231n』卷积神经网络的可视化应用 文件目录 vgg16.py import os import numpy as np import tensorflow as tf from downloa ...

  10. 2018"百度之星"程序设计大赛 - 资格赛 A/B/E/F

    调查问卷  Accepts: 505  Submissions: 2436  Time Limit: 6500/6000 MS (Java/Others)  Memory Limit: 262144/ ...