方法/步骤

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>

如何在HTMl网页中插入百度地图的更多相关文章

  1. 网页中嵌入百度地图报错:The request has been blocked,the content must served over Https

    网页中嵌入百度地图 1.进入百度地图开发平台:http://lbsyun.baidu.com/index.php?title=jspopular 2.获取密钥:http://lbsyun.baidu. ...

  2. pc网页中嵌入百度地图

    pc网页中嵌入百度地图 1 打开百度地图生成器: http://api.map.baidu.com/lbsapi/creatmap/ 2 设置好了之后,点击获取代码,将代码粘贴到文件中保存为html文 ...

  3. 如何在网页中调用百度地图api

    我想在木有提供地图接口的年代,前端工程师门要么只写上企业的具体地址,要么就是用一张标有自己位置的地图图片.但是现在不一样啦!为了增强用户体验,谷歌,甚至百度都很开放了,你可以在他们的网站上找到地图接口 ...

  4. 细话 - 如何在web应用中使用百度地图

    初步接触了高德地图嵌入到网站应用中的知识后,对高德地图提供的文档,源码以及使用快捷,方便非常满意. 由此,利用周末时间研究了下如何使用 百度地图 . 总的来说,方式方法都差不多,都提供了源码和文档实例 ...

  5. 安卓---项目中插入百度地图sdk

    百度地图 应用里面 自带地图 搜房网 下载百度地图的sdk 熟悉api 注冊百度开发人员的账号 2.12 仅仅要有一个ak就能够 高版本号须要提供应用程序的包名和签名返回开发人员的序列号 使用百度地图 ...

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

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

  7. C# 程序中嵌入百度地图

    本例是对WinForm中使用百度地图的简要介绍.百度地图目前支持Android开发,IOS开发,Web开发,服务接口,具体可以参照'百度地图开放平台'. [动态加载百度地图]涉及到的知识点: WebB ...

  8. 如何在vue单页应用中使用百度地图

    作为一名开发人员,每次接到开发任务,我们首先应该先分析需求,然后再思考技术方案和解决方案.三思而后行,这是一个好的习惯. 需求:本项目是采用vue组件化开发的单页应用项目,现需要在项目中引入百度的地图 ...

  9. Vue --》 如何在vue中调用百度地图

    1.项目根目录下下载百度地图插件 npm install vue-baidu-map –save 2.在首页index.html中引入百度地图: <script type="text/ ...

随机推荐

  1. ApplicationWindow

    本文介绍了一个使用ApplicationWindow 和Action 实现的一个文本编辑器.界面美观,基本功能齐全.代码齐全. 首先看 MainWindow.java. //MainWindow.ja ...

  2. WKWebView捕获HTML弹出的Alert和Confirm

    之前用WebView装载一个网页时,弹出Alert时会显示网址,由于不想把网址暴露给用户这样显示就不是很友好了.UIWebView文档内没有找到可以捕获这类信息的API.GOOGLE了下发现了WKWe ...

  3. 005商城项目:ssm框架的整合成功之后的问题:使用maven的tomcat插件时的debug

    在执行maven的clean时经常碰到一个问题: 解决: 然后: 还有一个问题是:用maven 使用Debug调试时,不能看到源代码. 解决办法: 下面选择Debug Configurations 这 ...

  4. DEDECMS之八 漏洞错误和疑难杂症

    1.dedecms文章加粗b属性后出现strong或者b标签修改 dedecms的文章,如果设置了加粗的属性后,文章标题那会自动添加一个strong或者是b标签,如何去掉呢,方法如下: a.更改自动添 ...

  5. 修改Esxi克隆的CentOS的IP地址

    1.读取/etc/udev/rules.d/70-persistent-net.rules文件中eth1的MAC地址. 2.编辑文件 /etc/sysconfig/network-script/ifc ...

  6. python install

    Install all dependencies by pip install -r requirements.txt (Run this command from project root)

  7. jboss上的soap web service开发示例

    以下示例,由jboss quickstart示例代码得来: 一.创建一个常规的dynamic web项目,建议支持maven ,项目的关键属性参考下图: 二.定义服务接口及参数对象 HelloWorl ...

  8. Python2.6-原理之类和oop(上)

    来自<python学习手册第四版>第六部分 一.oop:宏伟蓝图(26章) 在这之前的部分中,经常会使用"对象"这个词,其实,到目前为止都是以对象为基础的,在脚本中传递 ...

  9. 基于DDD的.NET开发框架 - ABP的Entity设计思想

    返回ABP系列 ABP是“ASP.NET Boilerplate Project (ASP.NET样板项目)”的简称. ASP.NET Boilerplate是一个用最佳实践和流行技术开发现代WEB应 ...

  10. Qt环境搭建(Qt Creator)+Visual Studio

    1.http://www.cnblogs.com/ranjiewen/p/5318768.html 简述 经常有人问我编写Qt程序时使用什么IDE,其实这个真的很难回答(各有所长),只能说看个人爱好了 ...