方法/步骤

1、打开“百度地图生成器”的网址:http://api.map.baidu.com/lbsapi/creatmap/index.html

如下图:

2、在“1.定位中心点”中,切换城市,并查找具体位置,如下图:

3、在“2.设置地图”中,可以按照自己的喜好修改地图的外观:

a、地图的宽和高

b、地图上显示的按钮(缩放、缩略图、比例尺)

c、鼠标和键盘对地图的操作

如下图:

4、在“3.添加标注”中,可以添加自己想要标注的位置和信息,如下图:

5、在“第二步 获取代码”中,点击“获取代码”按钮,就会弹出根据上面的设置生成代码,如下图:

6、把上一步生成的代码保存为html文件(我这里保存为map.html),在浏览器中打开就可以看到自己定义的百度地图了。

如果要把地图添加到现有的网页中,可以使用iframe标签,如:

<iframe src="map.html" width="600" height="300" frameborder="0" scrolling="no"></iframe>

本文是参考 https://www.cnblogs.com/jiuban2391/p/6106577.html 总结而来;

HTML插入地图的更多相关文章

  1. JavaScript(五)——插入地图

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

  2. HTML插入地图的方法

    方法/步骤 1.打开"百度地图生成器"的网址:http://api.map.baidu.com/lbsapi/creatmap/index.html 如下图: 2.在"1 ...

  3. JavaScrip——插入地图

    具体操作步骤:1.百度搜索:百度地图生成器 2.打开第一个,复制网址http://api.map.baidu.com/lbsapi/creatmap/index.html,打开3.页面显示为 4.根据 ...

  4. JavaScript----marquee滚动标签 图片无缝滚动 插入百度地图

    页面的自动滚动效果,可由javascript来实现, 但是有一个html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制. 使用marquee ...

  5. 页面中插入百度地图(使用百度地图API)

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWF5dW4wNTE2/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA ...

  6. (五)ORBSLAM关键帧的筛选和插入

    ORBSLAM2的关键帧简介 图像插入频率过高会导致信息冗余度快速增加,而这些冗余的信息对系统的精度却十分有限,甚至没有提高,反而消耗了更多的计算资源.这等于吃力不讨好. 关键帧的目的在于,适当地降低 ...

  7. 使用EXCEL绘制三维地图(超简单的五分钟绘制地图方法,妈妈再也不用担心我不会画地图啦~)

    博主为从区域规划转行地图学的小学渣一枚,最近处理数据希望对结果进行三维可视化,意外发现从小用到大的EXCEL可以绘制地图且功能非常强大,在这里做一下简单介绍,希望可以给看官提供些许帮助.那下面就开始吧 ...

  8. 在cms以及kindeditor中插入百度动态地图的方法

    想在网页中插入动态地图不难,直接打开网址http://api.map.baidu.com/lbsapi/creatmap/,然后按照提示操作,最终生成脚本,放到html文件中即可.而在kindedit ...

  9. 借助百度地图API制作企业百度地图

    做网站需要插入地图,可以借助百度地图API,具体步骤如下: 1.打开百度地图API的网址:   http://api.map.baidu.com/lbsapi/creatmap/ 2.设置中心点 3. ...

随机推荐

  1. Python字符串逐字符或逐词反转方法

    Python字符串逐字符或逐词反转方法 这篇文章主要介绍了Python字符串逐字符或逐词反转方法,本文对逐字符或逐词分别给出两种方法,需要的朋友可以参考下 目的 把字符串逐字符或逐词反转过来,这个蛮有 ...

  2. android 超简单的拖动按钮 悬浮按钮 吸附按钮 浮动按钮

    第一种    第二种    第一种实现方法 xml布局 <RelativeLayout xmlns:android="http://schemas.android.com/apk/re ...

  3. Dart 语言简述

    Dart是一种“结构化的web编程”语言,Dart编程语言在所有现代浏览器和环境中提供高性能.Dart是谷歌开发的计算机编程语言,后来被ECMA认定为标准. Dart重要的概念: 1.所有的东西都是对 ...

  4. Windows 7通过VirtualBox配置镜像加速

    配置Docker镜像加速: 1.双击,开启default 2.开启后执行下面的命令修改profile文件: sudo vi /var/lib/boot2docker/profile 打开文件之后,敲下 ...

  5. PJzhang:目录扫描复合工具dirmap

    猫宁!!! 参考:https://www.freebuf.com/sectool/200890.html github地址: https://github.com/H4ckForJob/dirmap ...

  6. C++——文件的读写

    C++中标准IO库的fstream头文件定义了三种支持文件IO的类型: ifstream,由istream派生而来,提供读文件的功能. ofstream,由ostream派生而来,提供写文件的功能. ...

  7. lua程序设计 第一章习题答案

    练习1.1:运行阶乘的示例并观察,如果输入负数,程序会出现什么问题?试着修改代码来解决问题. 答:当输入负数时,循环无法终止,因为原本程序中的终止条件为n==0,而在输入为负数情况下,无法达成此终止条 ...

  8. [mysql] C++操作mysql方法

    下载:http://mirrors.sohu.com/mysql/MySQL-5.5/ From: http://www.cnblogs.com/magicsoar/p/3817518.html C+ ...

  9. 【AtCoder】AGC033(A-F)

    AGC033 A - Darker and Darker 直接BFS #include <bits/stdc++.h> #define fi first #define se second ...

  10. 记2017年年底,几次Python后端面试

    1. 果壳 电话面试: 说一下TCP的三次握手,四次挥手,为什么会这样? http安全的性的了解,说一下对cookie和session的了解: 对mysql的了解,说一下你常用的数据类型,char和v ...