不到断气不罢休 发表于 2024-7-24 11:42:40

手把手教你搭建个人地图服务器(高德离线部署解决方案):获取地图瓦片数据

一、概述

众所周知,目前常见的地图(高德、百度、腾讯等)只提供在线API服务,对于一些内网应用而言,如果需要使用地图展示,则由于不能访问互联网而无法使用类似的第三方地图服务。
本文,通过将高德地图瓦片数据 和 在线JS API做了本地部署,并修改API,将其所有的网络哀求均变为本地哀求。乐成实现了私有化部署!
二、爬取瓦片数据

1.获取地图下载器
这是一个开源项目,使用Java开发的地图瓦片图下载工具,支持OpenStreetMap、天地图、谷歌地图、高德地图、腾讯地图、必应地图的XYZ瓦片图下载与合并。点击以下任意链接获取工具。
1)源码下载,编译后使用
2)百度网盘下载编译后的程序,下载后直接使用即可。
链接:https://pan.baidu.com/s/1odjFKYzefLnu6c1223Fb_w?pwd=eocr
提取码:eocr
2.下载地图瓦片数据
PS:程序运行需要在全英文路径中
1)下载解压运行run.bat
2)选择地图资源 -> 选择省份/城市 -> 下载地图
https://img-blog.csdnimg.cn/direct/734e8df39b4c4201a9fb50769e9bd49e.png
3)选择层级我这里不需要太详细,以是到12层就够了,层级越高瓦片越多。定名风格选择/{z}/{x}/{y}.png,选择下载位置,点击下载开始下载
https://img-blog.csdnimg.cn/direct/5bb3af42be294d87b8d4e984383d0e3f.png
三、获取高德离线开发包

高德离线包已经存至我的Gitee项目中:(点击链接下载即可)高德地图离线开发包
   怎样使用高德地图请参考官方文档:快速上手-地图 JS API 2.0 | 高德地图API
四、怎样在项目中使用

以vue项目为例:
1.将下载的瓦片数据和离线包放到项目标public下
https://img-blog.csdnimg.cn/direct/916ae1aee0b844a8ab40c78ecbf5ceee.png
2.在MapView.vue中直接加载下载的amap文件夹下的AMap3.js,别的文件不可删除!!!如下图:
import "../../public/amap/AMap3.js"

https://img-blog.csdnimg.cn/direct/93c5692d943743c399801e59645bee4e.png
3.在页面中定义地图显示元素:
<div id='map-container' style="width: 100%; height: 600px;">

4.在代码中直接new AMap即可,vue项目标话不需要再去导入map插件配置,如下图直接使用即可。
https://img-blog.csdnimg.cn/direct/8a4c7dfb3f66472a9300fbaeec07b5ac.png
MapView.vue的全部代码如下:
<template><div id='map-container' style="width: 100%; height: 600px;">

</div><div>    <button @click="handleMarker()">标志</button>    <button @click="handlePolyline()">折线</button>    <button @click="handleTextmark()">文本标志</button></div></template><script>import "../../public/amap/AMap3.js"

export default {data() {    return {      mapObj: null,    }},methods: {    initMap() {      // 自定义地图层      const base_url = "/"      const layers =       this.mapObj = new AMap.Map('map-container', { // 设置地图容器id          resizeEnable: true,          zoom: 15,          rotateEnable: true,          pitchEnable: true,          center: ,          defaultCursor: 'pointer',          showLabel: true,//是否显示文字标注          layers: layers,      })    },      handleMarker() {      const marker = new AMap.Marker({      position: , //位置      });      this.mapObj.add(marker); //添加到地图    },    handlePolyline() {      const lineArr = [      ,      ,            ];      const polyline = new AMap.Polyline({      path: lineArr, //设置线覆盖物路径      strokeColor: "red", //线颜色      strokeWeight: 5, //线宽      strokeStyle: "solid", //线样式      });      this.mapObj.add(polyline);    },    handleTextmark() {      // 创建纯文本标志      let text = new AMap.Text({          text:'粤电花都燃气电厂',          anchor:'center', // 设置文本标志锚点          draggable:true,          cursor:'pointer',          angle:10,          style:{            'padding': '.75rem 1.25rem',            'margin-bottom': '1rem',            'border-radius': '.25rem',            'background-color': 'white',            'width': '10rem',            'border-width': 0,            'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',            'text-align': 'center',            'font-size': '20px',            'color': 'blue'          },          position:       });      text.setMap(this.mapObj);      let text1 = new AMap.Text({          text:'双一橡胶',          anchor:'center', // 设置文本标志锚点          draggable:true,          cursor:'pointer',          angle:10,          style:{            'padding': '.75rem 1.25rem',            'margin-bottom': '1rem',            'border-radius': '.25rem',            'background-color': 'white',            'width': '10rem',            'border-width': 0,            'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',            'text-align': 'center',            'font-size': '20px',            'color': 'blue'          },          position:       });      text1.setMap(this.mapObj)    },},mounted() {    this.initMap()}}</script><style>@media (min-width: 1024px) {.about {    min-height: 100vh;    display: flex;    align-items: center;}}</style> 应用结果如下:
https://img-blog.csdnimg.cn/direct/d600320462cb4ce19d264291fe297064.png

怎样学习大模型

现在社会上大模型越来越普及了,已经有许多人都想往这内里扎,但是却找不到适合的方法去学习。
作为一名资深码农,初入大模型时也吃了许多亏,踩了无数坑。现在我想把我的履历和知识分享给你们,帮助你们学习AI大模型,能够解决你们学习中的困难。
我已将重要的AI大模型资料包括市面上AI大模型各大白皮书、AGI大模型体系学习门路、AI大模型视频教程、实战学习,等录播视频免费分享出来,需要的小同伴可以扫取。
https://img-blog.csdnimg.cn/img_convert/f155d4fe5c456a4c344acee40dd260d6.png 一、AGI大模型体系学习门路
许多人学习大模型的时候没有方向,东学一点西学一点,像只无头苍蝇乱撞,我下面分享的这个学习门路希望能够帮助到你们学习AI大模型。
https://img-blog.csdnimg.cn/direct/a8136a7d40614dff8a585c17e63c0d3e.png
二、AI大模型视频教程
https://img-blog.csdnimg.cn/direct/4710d75c5e794fe5acd76c9dc3c9b568.png
三、AI大模型各大学习册本
https://img-blog.csdnimg.cn/direct/8e88cca417324c0a8e714f01e64376f9.png
四、AI大模型各大场景实战案例
https://img-blog.csdnimg.cn/direct/59b4a9db64e44ea781bfdc2774f1c0ba.png
五、结束语
学习AI大模型是当前科技发展的趋势,它不仅能够为我们提供更多的机会和挑衅,还能够让我们更好地明白和应用人工智能技能。通过学习AI大模型,我们可以深入了解深度学习、神经网络等核心概念,并将其应用于自然语言处理、计算机视觉、语音辨认等范畴。同时,把握AI大模型还能够为我们的职业发展增加竞争力,成为未来技能范畴的领导者。
再者,学习AI大模型也能为我们自己创造更多的价值,提供更多的岗位以及副业创收,让自己的生活更上一层楼。
因此,学习AI大模型是一项有前景且值得投入的时间和精力的重要选择。

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: 手把手教你搭建个人地图服务器(高德离线部署解决方案):获取地图瓦片数据