百度地图如何创建一个属于自己的地图,附加到项目中?

简介: 百度地图如何创建一个属于自己的地图,附加到项目中?

创建地图-百度地图生成器

一、打开百度地图生成器的网址

网址:http://api.map.baidu.com/lbsapi/creatmap/

可以看出官方给出了两个步骤:

第一步:创建地图

第二步:获取代码

特别的简单。动动鼠标,点点地图就可以做到了少写几百行代码的目的。name接下来咱们一起看一下从创建到在真实代码中是如何使用的。

二、创建地图

(一)定位中心点

定位中心点:这个功能就是执行了下面两个操作
var map = new BMap.Map("map");//在百度地图容器中创建一个地图
var point = new BMap.Point(117.19564,36.682652);//定义一个中心点坐标

可以选择当前的城市,也可以输入一个比较详细的地点,也可以用鼠标拖动地图来选择合适的位置。

注意:地图的级别可以由滚动鼠标来决定

(二)设置地图

可以设置地图的尺寸,也可以调整地图上的控件的位置以及默认显示的状态等。很方便,可以根据自己的需求来设定。

(三)添加标注

在线创建的标注支持三种方式,如下面三个图

咱们来添加一个坐标测试下

输入一些描述

点击后:

也可以添加多个

预览

预览时的图片可能存在问题,先忽略吧

三、获取代码

点击获取代码

复制下来弹出的代码

在ide中跑起来这个代码

把代码复制到ide创建的html中

如果没有这个key的童鞋可以看这篇:

https://blog.csdn.net/qq_17623363/article/details/103234119

很详细,去注册一下就好了。

测试

然后就可以成功的看到结果了:

目录
相关文章
|
2月前
uni-app项目中如何添加百度统计代码?
uni-app项目中如何添加百度统计代码?
|
11月前
|
Java 应用服务中间件 Linux
百度搜索:蓝易云【Linux系统安装tomcat并部署项目。]
Tomcat是一种常用的Web应用程序服务器,它是Apache软件基金会下的一个开源项目,能够处理Java Servlet和JSP等动态网页。
73 0
|
12月前
|
定位技术
百度地图:监听地图缩放自动显示和隐藏的富文本标签
百度地图:监听地图缩放自动显示和隐藏的富文本标签
156 0
|
12月前
|
搜索推荐 定位技术
百度地图开发mapStyle个性化地图styleJson的配色解决方案
百度地图开发mapStyle个性化地图styleJson的配色解决方案
526 0
|
12月前
|
数据可视化 搜索推荐 JavaScript
数据可视化大屏百度地图区域掩膜MapMask实现地图指定区域非省市县行政区显示的实战案例解析(JavaScript API GL、个性化地图定制、指定区域经纬度拾取转化)
数据可视化大屏百度地图区域掩膜MapMask实现地图指定区域非省市县行政区显示的实战案例解析(JavaScript API GL、个性化地图定制、指定区域经纬度拾取转化)
779 0
|
2月前
|
JavaScript 搜索推荐 定位技术
【百度地图2.5D、3D在Vue项目中的使用】嵌入二维百度地图、三维百度地图、多种显示模式风格样式颜色的百度地图
【百度地图2.5D、3D在Vue项目中的使用】嵌入二维百度地图、三维百度地图、多种显示模式风格样式颜色的百度地图
|
2月前
|
Ubuntu Linux
百度搜索:蓝易云【Linux平台下构建TigerVNC项目教程】
至此,你已经成功在Linux平台下构建并安装了TigerVNC项目。现在你可以启动VNC服务器并通过VNC客户端连接到远程桌面。请注意,上述步骤仅适用于一般情况,具体的构建步骤可能会因为不同的系统环境和版本而有所不同。在实际操作中,可能还需要根据实际情况进行一些调整。
48 1
|
12月前
|
移动开发 JavaScript 定位技术
百度地图开发:地图调起API(Web端)使用终点经纬度直接调用百度地图导航信息的解决方案
百度地图开发:地图调起API(Web端)使用终点经纬度直接调用百度地图导航信息的解决方案
270 0
|
2月前
|
Java Docker 容器
百度搜索:蓝易云【Docker部署jar项目教程】
请注意,以上是一个基本的教程,具体的步骤可能因项目结构和需求而有所不同。您可能需要根据实际情况进行调整和配置。同时,确保您的系统已经正确安装并配置了Docker。
56 1
|
资源调度 JavaScript
vue项目:集成富文本编辑器 - 百度ueditor(vue-ueditor-wrap)
vue项目:集成富文本编辑器 - 百度ueditor(vue-ueditor-wrap)
351 0