-
2022-05-02 10:19:05
记录一下自定义地图失效的问题~~
正常引用:
index:html:
<script src="https://webapi.amap.com/maps?v=1.4.4&key=高德地图key值"></script>
需要引入的页面:Home
这里加载的时候报错了;说是AMap未定义;
在.eslintrc.js文件加入: globals: { AMap: “true”} ;
然后自定义样式就一直是失效的状态,找了一些资料说是高德地图2021年12月02日升级了,自定义的样式要配置安全密钥 jscode(开发环境下选择第二种方式配置安全密钥‘);这个步骤已做但还是无效,最终发现是因为自己的自定义样式 ’ 未发布‘== 发布一下就可以正常使用了。乌鱼子。。。
更多相关内容 -
如何用高德自定义地图数据制作GIS矢量地图?
2021-01-26 06:46:58原标题:如何用高德自定义地图数据制作GIS矢量地图?无论是高德地图、百度地图还是其它基于地图服务的互联网Web地图,是无法获取服务器端的矢量数据的。web地图只提供了有限的地图模版。好在百度、高德陆续推出了...原标题:如何用高德自定义地图数据制作GIS矢量地图?
无论是高德地图、百度地图还是其它基于地图服务的互联网Web地图,是无法获取服务器端的矢量数据的。web地图只提供了有限的地图模版。好在百度、高德陆续推出了在线自定义地图,用户可以通过设置不同图层的色彩配置个性地图。尽管如此,仍然不能满足专业地图的制作需求。比如下面效果的二维三维地图。在线地图的自定义操作比较简单。下面介绍一下,如何将小范围的在线切片数据转换为GIS矢量数据。
1、这里以高德地图为例。首先进入到高德自定义地图站点。方法是在百度搜索【高德地图api】,进入后页面如下所示:
2、如果没有帐号,先注册帐号,注册完成后登录进入自定义地图页面。默认提供了几种默认模版。如下图所示:
3、这里选择【标准】地图模版,即上面的第一个模版。点击【使用该模版】进入页面。效果如下图所示:
4、此时,你应该已经明白该如何操作了。左侧的一级面板里列出了各种类型的标签、线状和面状图层,你可以自定义每个图层的颜色、透明度和可见性。这些便是高德自定义地图提供的所有能够自定义的功能,也是最大限度的功能了。例如,你可以把水系设置为红色,高速公路设置为紫色。
5、掌握了基本的设置方法。接下来开始配置我们需要的自定义地图,为数据的矢量化做准备。这里以广州的【流花湖o公园为例】。首先导航至此公园,并调整你想要的地图比例尺。
6、我们的思路是,提取所需要的每一个图层。需要做的事情是:将所有图层都设置为不可见,则背景为白色。然后将每个所需的图层逐个设置为黑色,并截图保存。这样做得目的是可在GIS软件里实现自动矢量化。这里以建筑物和道路为例。截图效果如下图所示:
建筑物图层:
道路图层
7、依次提取其它图层:
8、提取完成后,在ArcGIS中建模进行自动矢量化。思路是:选择每个图层的任何一个波段,然后使用【重分类】将底色(白色)和要素(黑色)进行二值化。然后使用【栅格转面】将栅格转换为矢量。最后使用【筛选】提取目标要素。模型如下图所示:
9、提取完成后,部分结果图层如下图所示:
10、基于以上数据可以制作二维或者三维地图。如下图为ArcGIS制作的简单二维图。
至此,从高德地图自定义数据,然后获取数据再到处理数据,最后得到矢量数据并进行更为自由、更为高级的配图过程大概如此。返回搜狐,查看更多
责任编辑:
-
基于高德自定义地图数据的GIS矢量地图制作
2021-01-27 14:39:01好在百度、高德陆续推出了在线自定义地图,用户可以通过设置不同图层的色彩配置个性地图。尽管如此,仍然不能满足专业地图的制作需求。比如下面效果的二维三维地图。在线地图的自定义操作比较简单。下面介绍一下,...无论是高德地图、百度地图还是其它基于地图服务的互联网Web地图,是无法获取服务器端的矢量数据的。web地图只提供了有限的地图模版。好在百度、高德陆续推出了在线自定义地图,用户可以通过设置不同图层的色彩配置个性地图。尽管如此,仍然不能满足专业地图的制作需求。比如下面效果的二维三维地图。在线地图的自定义操作比较简单。下面介绍一下,如果将小范围的在线切片数据转换为GIS矢量数据。
1、这里以高德地图为例。首先进入到高德自定义地图站点。方法是在百度搜索【高德地图api】,进入后页面如下所示:
2、如果没有帐号,先注册帐号,注册完成后登录进入自定义地图页面。默认提供了几种默认模版。如下图所示:
3、这里选择【标准】地图模版,即上面的第一个模版。点击【使用该模版】进入页面。效果如下图所示:
4、此时,你应该已经明白该如何操作了。左侧的一级面板里列出了各种类型的标签、线状和面状图层,你可以自定义每个图层的颜色、透明度和可见性。这些便是高德自定义地图提供的所有能够自定义的功能,也是最大限度的功能了。例如,你可以把水系设置为红色,高速公路设置为紫色。
5、掌握了基本的设置方法。接下来开始配置我们需要的自定义地图,为数据的矢量化做准备。这里以广州的【流花湖o公园为例】。首先导航至此公园,并调整你想要的地图比例尺。
6、我们的思路是,提取所需要的每一个图层。需要做的事情是:讲所有图层都设置为不可见,则背景为白色。然后将每个所需的图层逐个设置为黑色,并截图保存。这样做得目的是可在GIS软件里实现自动矢量化。这里以建筑物和道路为例。截图效果如下图所示:
建筑物图层:
道路图层:
7、依次提取其它图层:
8、提取完成后,在ArcGIS中建模进行自动矢量化。思路是:选择每个图层的任何一个波段,然后使用【重分类】将底色(白色)和要素(黑色)进行二值化。然后使用【栅格转面】将栅格转换为矢量。最后使用【筛选】提取目标要素。模型如下图所示:
9、提取完成后,部分结果图层如下图所示:
10、基于以上数据可以制作二维或者三维地图。如下图为ArcGIS制作的简单二维图。
本站声明
本文仅代表作者观点,不代表城市数据派立场;
本文系作者授权城市数据派发表,未经许可,不得转载;
本网站上的所有内容均为虚拟服务,一经购买成功概不退款,请您理解。
-
高德地图自定义信息窗体样式
2021-08-25 16:15:57高德地图自定义信息窗体样式 -
18.(leaflet篇)leaflet自定义地图样式地图(插件实现).zip
2021-07-05 09:45:07下载如有问题,可私信博主。下载前建议先查看博客内容,其地址为:https://blog.csdn.net/QQ98281642/article/details/118481878 -
高德地图自定义创建地图
2021-05-12 09:32:391、首先打开高都地图api自定义地图界面(自定义地图) 2、点进去,进行自定义地图配置 自定义样式 3、定义结束,点击发布 4、接下来点击使用自定义地图,会生成一串码 5、点击复制,在地图初始化调用这...1、首先打开高都地图api自定义地图界面(自定义地图)
2、点进去,进行自定义地图配置
自定义样式
3、定义结束,点击发布4、接下来点击使用自定义地图,会生成一串码
5、点击复制,在地图初始化调用这个就可以了
var map = new AMap.Map('container', { zoom: 4, mapStyle: 'amap://styles/212b098c51dfc53a0a99v2b1e147a7b3', //设置地图的显示样式 });
=========================================================================================================================================
或者在第4步的时候点击JS API调用方法
根据页面提示创建自定义地图html页面
效果:
高德地图可以根据自己的想法在地图上添加自己想要的内容,具体步骤,可以根据上面的快速上手方法依次添加,制作出自己想要的内容
-
【高德地图进阶】--- 自定义地图
2021-12-26 14:52:27在开发的过程中, 有时候高德官方地图样式无法符合需求,这就需要我们自定义地图的样式了. 步骤:登录高德地图–>进入控制台–>自定义地图 可以直接创建地图,也可以在模板基础上进行修改 可以控制颜色,显隐 ,... -
高德地图生成自定义地图
2021-05-11 11:24:38登录高德地图后台,进入https://lbs.amap.com/dev/mapstyle/index 创建地图,设置完成颜色后点击发布,会生成一个地图的styleid 创建地图时使用该styleid即可 var map = new AMap.Map('container',{ ... -
vue3里面高德地图如何使用自定义地图
2022-05-20 15:27:112.访问这个高德自定义地图地址 创建一个你自己想要的模板 高德自定义地图地址 3.点击进入到你的模板,看到url了吗? styleid后面的一串字符就是你自定义地图模板的样式id 4.在你的vue3工程文件夹 ->public/index.... -
leaflet 加载百度自定义地图
2020-12-01 09:21:40leaflet 加载百度自定义地图,支持自定义百度地图样式 -
解决自定义高德地图不生效问题
2022-04-22 15:53:20问题来源 最近在做项目的过程中需要使用地图来绘制区域地图,但是UI要求图层中的地名少一点这样页面看上更加干净。在请教了组长之后,想到了两种办法: ...高德地图的自定义样式,在高德地图的控制台中, -
vue项目使用高德地图自定义地图样式
2020-05-25 10:22:23标题创建自定义地图 vue中在index.html中引入地图key <script type="text/javascript" src="https://webapi.amap.com/maps? v=1.3&key=你申请的key"></script> 使用自定义样式 ... -
Android基于高德地图完全自定义Marker的实现方法
2021-01-21 20:13:06本文中实现的方式都是基于高德地图的,百度地图也类似,大家可以照葫芦画瓢,废话不多说,先来看看最终效果: 实现思路: 先来看看高德官方提供的设置Marker图标的方法: 我们可以看到setIcon()方法,里面的参数... -
高德地图-自定义地图未生效
2019-07-23 10:23:45高德地图自定义地图教程 我按照上面链接的教程,在自定义地图平台进行创建、编辑、发布后,取得地图样式ID,然后再地图初始化时,设置自定义地图,发现并没有生效 原因:key生成的不对,之前选择的是“Web服务”,... -
高德地图自定义地图实例
2021-05-12 14:00:02Document 获取地图级别与中心点坐标 当前级别:11 当前中心点:121.498586,31.239637 -
高德地图自定义图层
2014-12-25 13:31:32高德地图自定义图层,能够实现用户点击后,提示文字 -
Android实现高德地图自定义样式
2021-05-26 15:32:25放置Android工程下的... } 在高德地图中指定你写出文件的路径。 String path=Environment.getExternalStoragePublicDirectory("data").getPath()+"/style.data" //该方法在AMap类中提供 setCustomMapStylePath(path); -
Android高德地图实现自定义地图样式
2020-07-04 15:09:45现在的应用中很多地方都会用到地图这个控件,但是地图提供给我们的样式有时可能...自定义地图](https://lbs.amap.com/api/android-sdk/guide/create-map/custom) 1.申请高德地图账号 
2022-01-11 10:48:26自定义地图 样式ID: 使用样式: 解决方案:如果后面接的是 样式id,必须加上安全密钥,就可以生效了。 key和安全密钥: 代码如下: const ref = useRef<HTMLDivElement>(null); const [map, setMap... -
高德地图自定义地图apidemo
2018-06-07 14:45:22高德地图自定义地图apidemo,地图样式,标注样式,自定义窗体 -
全功能瓦片地图下载(百度、高德、谷歌、腾讯、微软等等).zip
2019-11-14 22:17:59全功能瓦片地图下载(百度、高德、谷歌、腾讯、微软等等),亲测可用 解压密码123456 解压密码123456 -
mapboxwms天地图,高德地图,谷歌地图
2018-04-28 20:54:16mapboxwms天地图,高德地图,谷歌地图,使用最新mapbox,基类封装 -
mapbox-gl使用高德自定义样式底图(视频)
2021-03-17 17:11:53请参见公众号地址查看: ...mid=2247485497&idx=1&sn=51f6487eb93cdd07985b1c5213ec5dd7&chksm=fc8ba80bcbfc211df72b48d5925dcd8c44707e37d7610eca18cc403d917e555fa4fee49bedb1&token=416786478&... -
自定义高德地图的标记样式和内容
2020-12-29 06:49:11// 自定义点标记内容 var markerContent = document.createElement("div"); // 点标记中的图标 var markerImg = document.createElement("img"); markerImg.className = "markerlnglat"; markerImg.src = "/static/... -
高德地图自定义绘制园区区域,区域描边,并添加自定义内容maker标注
2022-06-16 10:29:21高德地图自定义绘制园区区域 边界描边 并添加指定点位maker 自定义maker内容 -
自定义地图底图(瓦片)Demo
2020-04-15 10:52:08实现在地图中指定区域显示自定义图片,并支持指定层级放大缩小, 点击链接预览效果 https://pi-ip.oss-cn-hangzhou.aliyuncs.com/map/map.html -
高德地图自定义点聚合图片
2019-04-26 17:40:34Android 高德地图自定义点聚合marker图片及Overlay点击选中功能的代码实现及布局文件 -
高德地图自定义infowindow
2018-04-28 13:16:43高德地图自定义infowindow,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,