解决Vue+Vite打包后Leaflet的marker图标不显示的问题

news2024/10/6 11:55:54

前言

用Leaflet写关于WebGIS的开发,用Vite或者webpack打包,打包后会找不到图标,如下所示。

直言的说,笔者去网上搜了搜,其实收到一个比较好是答案。网址如下。

(完美解决~)关于Vue+Leaflet添加market时,图片不显示的问题_vue2leafletjs地图添加marker不显示-CSDN博客

这位大佬的方法是可以的。以前笔者遇到这个问题是这样解决的。但笔者发现了第三种方法。

解决方法

将目录node_modules/leaflet/dist/images中的maker-icon-2x.png和marker-shadow.png文件复制到pubilc目录下。

再次打包,路径中出现那两张png图片,运行没有问题。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1862382.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

P2实验室装修标准都有哪些

P2实验室(也称为生物安全二级实验室,BSL-2实验室)的装修标准需要满足一系列的设计和施工要求,以确保实验室的安全性和功能性。因此,P2实验室装修标准不仅要满足一般实验室的要求,还需符合生物安全的特殊规定…

企业运维六边形战士 质量稳定 效率为王

随着信息化的不断深入和扩展,企业IT系统的复杂性和设备多样性日益增加。为了保障业务的高可用性和连续性,企业需要一个全面、高效、智能的一体化运维管理平台。在用户市场的推动下,LinkSLA智能运维管家展现出【六边形战士】的优质属性&#x…

数据结构-----【链表:刷题】

-------------------------------------------基础题参照leetcode---------------------------------------------------------------------------------------------------------- 【2】两数相加 /*** Definition for singly-linked list.* struct ListNode {* int val;…

ChatBI开源实现: 基于SuperSonic的AI+BI的产品设计

产品起源 为什么要做这样的产品?文章《ChatBI开源实现: AIBI的产品设计》中有介绍 为什么要自己做这样的产品?1、低成本试错;2、未来数据生态入口; 为什么要基于Supersonic做? 开源协议友好:可魔改商用 社区…

仿真分析 + AI:创建基础设施的新未来

吴付标 大漠风电,深远海平台,一带一路上的高铁、电站…… 在新一轮的基础设施建设浪潮中,项目与结构变得越来越复杂,碳中和与可持续发展的要求越来越高,仿真分析技术应运而兴。 在最近召开的Bentley软件2024创新智旅 …

【Python/Pytorch - 网络模型】-- 高阶SVD算法

文章目录 文章目录 00 写在前面01 基于Python版本的高阶SVD算代码02 HOSVD 的步骤 00 写在前面 高阶奇异值分解(Higher-Order SVD,HOSVD)是一种将传统的奇异值分解(SVD)扩展到高阶张量的方法。它能够将一个高阶张量分…

FileNotFoundError: Cannot find DGL C++ graphbolt library at ...

FileNotFoundError: Cannot find DGL C graphbolt library at ...-CSDN博客https://blog.csdn.net/weixin_44017989/article/details/137658749

SAP ABAP 之OOALV

文章目录 前言一、案例介绍/笔者需求二、SE24 查看类 a.基本属性 Properties b.接口 Interfaces c.友元 Friends d.属性 Attributes e.方法 Methods f.事件 Events g.局部类型 Types …

韩顺平0基础学java——第31天

p612-637 IO流 IO流原理及流的分类 Java lO流原理 1.I/O是Input/Output的缩弓,IV/O技术是非常实用的技术,用于处理数据传输。 如读/写文件,网络通讯等。 2. Java程序中,对于数据的输入/输出操作以”流(stream)”的方式进行。 3…

Orangepi Zero2 全志H616 的初识

目录 一、全志H616简介 1.1 为什么学: 1.2 学什么: 1.3 全志H616平台介绍: 二、刷机 系统启动和初始化配置 2.1 需要的工具: 2.2 工具安装: 2.3 刷机: 2.4 登录系统: 2.5 修改登录密码…

Android开发系列(十)Jetpack Compose之Card

Card是一种常用的UI组件,用于显示一个具有卡片样式的容器。Card组件通常用于显示列表项、卡片式布局或任何需要显示边框和阴影的UI元素。 使用Card组件,您可以轻松地创建带有卡片效果的UI元素。以下是一些Card组件的常见属性和功能: elevati…

云计算基础知识

前言: 随着ICT技术的高速发展,企业架构对计算、存储、网络资源的需求更高,急需一种新的架构来承载业务,以获得持续,高速,高效的发展,云计算应运而生。 云计算背景 信息大爆炸时代&#xff1a…

导出 S 参数扫描结果供 INTERCONNECT 使用

导出 S 参数扫描结果供 INTERCONNECT 使用 正文正文 有时候,对于 FDTD 无法直接进行仿真的大型仿真链路,我们需要使用 FDTD 针对单个小的模块进行仿真,再将得到的 S 参数结果导入到 INTERCONNECT 中使用,最终完成整个链路的仿真。通常完成 S 参数扫描后其状态如下图所示:…

CSS 原生属性 CSS文本显示省略号...

效果图: 直接上代码 .header {width: 100%;//使用百分比或者固定宽度,注意使用百分比时要确保父元素使用了百分比宽度height: 50px;line-height: 25px;font-weight: bolder;text-overflow: ellipsis;word-break: break-all;overflow: hidden;display: -…

第3章 小功能大用处-事务与Lua

为了保证多条命令组合的原子性,Redis提供了简单的事务功能以及集成Lua脚本来解决这个问题。 首先简单介绍Redis中事务的使用方法以及它的局限性,之后重点介绍Lua语言的基本使用方法,以及如何将Redis和Lua脚本进行集成,最后给出Red…

圈复杂度.

圈复杂度是衡量代码的重要标准 配置: eslint里面:rules:complexity:[error,10]

CppInsights: 学习C++模版的神器

CppInsights:深入理解C代码的利器 C是一门强大而复杂的编程语言,其复杂性主要体现在语言的多层次抽象和丰富的语法特性上。尽管这些特性使得C能够高效地处理复杂的任务,但也给开发者带来了理解和调试代码的巨大挑战。CppInsights正是在这一背…

DDL-表操作-数据类型

一.DDL-表操作-数据类型 MySQL中的数据类型有很多,主要分为三类:数值类型,字符串类型,日期类型。 二.关系表 注意: 无符号和有符号的取值范围不是一样的,无符号需要加上UNSIGNED范围。 BLOB:用来描述二进制数据 TEXT:用来描述字符串 三.定长字符串和变长字符串 c…

vue3实现模拟地图上,站点名称按需显示的功能

很久很久没有更新博客了,因为实在是太忙了,每天都有公司的事情忙不完....... 最近在做车辆模拟地图,在实现控制站点名称按需显示时,折腾了好一段时间,特此记录一下。最终界面如下图所示: 站点显示需求&…