当前位置: 首页 > article >正文

mapbox js本地化部署

移除mapbox-gl.js的token检测,使用本地sprite和glyphs,并支持相对路径而不是网络地址url
版本 vue3(v3.5.13) vite(v6.0.1)mapbox-gl.js(v3.9.3)
参考 https://github.com/HuHongYong/Mapbox-js-offline

  1. 在官网找到在线的js和css
    在这里插入图片描述
    把这俩文件下下来,放到前端工程路径下
    我是放到public下了,看习惯,也可以建个lib文件夹
    在这里插入图片描述

  2. 把字体文件和图标放到前端工程路径下
    在这里插入图片描述

  3. 修改js
    搜索normalizeSpriteURL(t
    在这里插入图片描述
    将该函数内容替换为
    return t + “.json”;
    在这里插入图片描述
    搜索this._requestManager._customAccessToken,(t=>
    在这里插入图片描述
    将t&&(t.message=w||401=t.status)替换为(t && false)
    在这里插入图片描述

  4. 引入js,css
    在这里插入图片描述

  5. 示例。字体和图标参考https://github.com/HuHongYong/Mapbox-js-offline这里面的
    在这里插入图片描述

  6. 效果
    在这里插入图片描述


http://www.kler.cn/a/513549.html

相关文章:

  • 用于牙科的多任务视频增强
  • 解锁Java中的国密算法:安全保障的密钥
  • 前瞻2024:前沿技术的全景洞察与深度剖析
  • 最大矩阵面积问题
  • mybatis的多对一、一对多的用法
  • Ubuntu22.04安装paddle GPU版本
  • Python Web开发:使用FastAPI构建视频流媒体平台
  • 嵌入式产品级-超小尺寸热成像相机(从0到1 硬件-软件-外壳)
  • 【C++】开源:libpcap网络数据捕获库安装与应用
  • 【python】实现图像中的阴影去除 | 方案和代码
  • Nginx HTTP 服务器基础配置
  • 2090. 半径为 k 的子数组平均值
  • 【深度学习基础】多层感知机 | 多层感知机概述
  • Android开发,待办事项提醒App的设计与实现(个人中心页)
  • httpx上传文件/IO流缓慢的问题分析及解决
  • SQL-leetcode—1141. 查询近30天活跃用户数
  • 在亚马逊云科技上用AI提示词优化功能写出漂亮提示词(下)
  • css动画水球图
  • 【数学建模美赛速成系列】O奖论文绘图复现代码
  • VM模块开发 C++ 工程配置
  • “大模型横扫千军”背后的大数据挖掘--浅谈MapReduce
  • Spring Boot + Netty + WebSocket 实现消息推送
  • 深挖——final
  • 分布式搜索引擎02
  • Emacs折腾日记(十一)——求值规则
  • EXCEL的一些用法记录