Mapbox GL弹出式文本无法选择。

Question

我的弹窗中的文字是无法选择的。 我可以通过点击等方式关闭弹出窗口，但是当把指针悬停在文本上时，指针仍然是指针图标，从来没有变成工字型文本选择图标。我尝试了几种不同的方式添加弹出窗口，都没有效果。

//with visgl/react-mapbox-gl:
<Popup latitude={0.0} longitude={0.0}>this text is unselectable</Popup>

//via the regular api:
new MapboxGL.Popup()
    .setLngLat([0.0, 0.0])
    .setHtml(<h1>this text is also unselectable</h1>)
    .addTo(map);

//this method that I copied from somewhere:
const placeholder = document.createElement('div');
ReactDOM.render(<h1>still unselectable</h1>, placeholder);
new MapboxGL.Popup()
     .setDOMContent(placeholder)
     .setLngLat()
     .addTo(map);

在... 地图盒 例子他们的文字是可以选择的。知道为什么我的不能选吗？谢谢，我的弹出窗口的文字是不可选择的。

Answer 1

如果没有运行的例子，相信很难找到具体原因。这里有一些想法。

• 使用他们在例子中使用的相同的类作为内容。mapboxgl-popup-content
• 检查HTML，看看是否有某种无形的分层元素 在你的文本之上。从浏览器DevTools中，在 "Inspector"(Firefox)或 "Elements"(Chrome)选项卡中，通过悬停标签，你就能看到每个渲染元素的边界框，像这样。

• 类似于之前的观点，检查 z-index 在渲染元素中的CSS属性，以查看是否有东西没有在你的内容上分层。

最后，还有 游标 CSS属性，你可以用它来强制光标的出现。