Leaflet 如何在弹出窗口中隐藏尾部三角形

---

我正在使用传单渲染mapbox地图。标记顶部有一个小三角形；如何隐藏它？

此三角形由css中的

小册子弹出提示

类控制。如果您使用的是标准传单，您应该能够通过在css中添加以下内容来隐藏提示（在加载

传单.css

之后）：

Mapbox实际上以与标准传单稍有不同的方式创建提示，通过设置元素边框而不是元素内容的样式，因此如果您使用

Mapbox.js

，您应该能够通过添加以下内容（在加载

Mapbox.css

之后）来完成此操作：

---

对于其他在这篇文章中遇到的人来说，他们可能正在与工具提示三角形，甚至是工具提示的背景css作斗争，我把我的研究放在一个地方，发现了影响三角形和工具提示背景以及弹出窗口的各种方法

如果将弹出窗口绑定到标记，

。传单弹出提示

控制三角形。我把它藏在这里：

.leaflet-popup-tip {
    background: rgba(0, 0, 0, 0) !important;
    box-shadow: none !important;
}

如果有添加到地图的工具提示，可以使用以下神奇的css控制工具提示的三角形：

.leaflet-tooltip-top:before, 
.leaflet-tooltip-bottom:before, 
.leaflet-tooltip-left:before, 
.leaflet-tooltip-right:before {
    border: none !important;
}

更多样式： 弹出：您还可以通过定位

。传单弹出内容包装器
来控制弹出内容的css。在这里，我将完全删除弹出窗口背景/边框/框的所有痕迹，并放大字体：

.leaflet-popup-content-wrapper {
    background: rgba(0, 0, 0, 0) !important;
    border: none !important;
    font-size: 20px;
    box-shadow: none !important;
}

工具提示：您可以在创建工具提示时将类名添加到工具提示，例如
{className:“popup'}
，然后使用该类名设置工具提示的样式：

.popup {
    background: rgba(0, 0, 0, 0) !important;
    border: none !important;
    font-size: 20px;
    box-shadow: none !important;
}

要了解如何向地图添加工具提示和弹出窗口，以及所有这些是如何协同工作的，下面是一个带有注释的工作示例：

希望这对某人有帮助！：）
 你能给我们提供代码以及我在CSS文件中添加的问题的示例吗？但它不起作用，请在这里签出：嗯。。。该页面实际上根本没有向我显示任何地图，因为它在
kiwich map.js
的第97行失败，错误为
无法读取null的属性“lat”。我不知道到底是什么原因造成的，但我猜可能是API有问题。然而，我意识到Mapbox以不同于标准传单的方式创建提示，因此我更新了may Response，并为
Mapbox.js
提供了一个解决方案。
.leaflet-popup-content-wrapper {
    background: rgba(0, 0, 0, 0) !important;
    border: none !important;
    font-size: 20px;
    box-shadow: none !important;
}

.popup {
    background: rgba(0, 0, 0, 0) !important;
    border: none !important;
    font-size: 20px;
    box-shadow: none !important;
}