我尝试将 fiBounds 与 WebMercatorViewport 对象一起使用，但收到有关 padding 属性的错误。我的代码：const initialViewState: IViewport | WebMercatorViewport = useMemo(() => {if (locationsFitBounds) {const minLat: number = Math.min(..
2022-12-19
我尝试使用 fitBounds 使所有标记都以适当的缩放级别可见。getBounds(){return [[12.49637,41.90278],[12.319398,45.441906],[13.055054,47.809532],[16.373724,48.208244]]}<Mapstyle="mapbox://styles/mapbox/streets-v9"containerStyle=
2017-07-13
我正在使用 Mapboxgl 和 React 在我的网页上显示地图，但在设置 mapbox 的大小时遇到了很大的麻烦。我编写了自己的 css 类来至少显示地图，否则由于某种原因，它显示的高度为 0。我的自定义 css 类如下所示.custom-map {display: flex;width: 100%;height: 54em;}我还在我的项目中本地加载了mapboxgl css文件，完整文
我正在尝试将一个基本的 deck.gl（mapbox 静态地图）添加到一个 react 项目 - 我可以做到这一点；但是，一旦地图加载完成，它就会占据整个页面，任何其他信息都会隐藏在地图后面。例如，我在地图上方的<p>中有一些文本，但它应该显示在地图上方，但却隐藏在地图后面。尝试调整地图所在的 div 的大小均失败：margin-top、height 等。该类名为 DglMapclass DglM
我试图让地图响应我的网站，因此我添加了 if 语句，但它不起作用，宽度只有在我手动编辑时才会改变。有人可以帮忙吗？我一直在尝试解决这个问题，但我只是不明白为什么它不起作用let phone = "320";let tablet = "900";let bigScreen = "2600";let bigLaptop = "1400";let laptop = "1000";function use
2020-09-14
我有一个 Mapbox GL JS 应用，我在地图上显示一些小部件。为了确保地图上的任何内容都不会被它们隐藏，我使用map.setPadding()添加了一些填充。它是不对称的（在我的情况下，左边大于右边）。它按预期适用于fitBounds和动画等，但我还需要设置地图的maxBounds，以便用户不会超出所需的视口。不幸的是，这不适用于自定义填充。当我绘制边界并使用showPadding时，我可以
2020-09-28
我的地图实例位于可调整大小的容器中，当我更改大小时，我应该调用 map.resize()。我想知道是否有办法监听 mapbox 容器调整大小事件，以便它可以触发 map.resize()？您能建议如何操作吗？export default function Map({ chartID, configuration, data }) {const classes = useStyles();const
2021-07-30
使用map.fitBounds(bounds, {padding: 100})，可以在设置边界时添加填充，以确保您的标记（“边界”所基于的标记）都很好地显示在地图的可视部分内。我想在构造函数中实现相同的功能，其中可以像这样设置边界：var map = new mapboxgl.Map({container: 'MapPanel',style: 'mapbox://styles/mapbox/str
2022-03-31
尝试将一些标记渲染到我的 mapbox 地图，但似乎无法渲染标记。我怀疑这是 .addTo 方法的问题，但我不知道我还要传入什么。我试过 this.mapContainer、document.getElementById('app')（我的主 div）和 this.map，但它们都无法渲染标记。不知道是我传递给 .addTo 的参数还是其他原因。 componentDidMount() {c
2020-04-29
我一直在从事一个房地产项目，但一直无法在标记弹出窗口中添加 reactcomponent。下图显示了弹出窗口的示例：弹出窗口示例这是我尝试在标记上添加弹出窗口的代码：var card = <Card />var popup = new mapboxgl.Popup({ offset: 25 }).setDOMContent(ReactDOM.render(card, document.getEle
2020-11-03
此代码用于使用用户输入的值创建标记，并使此标记固定。但我甚至无法创建标记，什么也没发生。渲染后，它停留在初始位置。我告诉过它可能是纬度和经度顺序，但我尝试这样做，它一直在加载。我也尝试删除 flyTo，但什么也没改变 export default function Map() {const mapContainer = useRef(null);const [lng, setLng] = use
2021-05-10
我正在使用react-map-gl和状态，以便当单击标记时，popupOpen设置为 true，并且弹出窗口会显示出来。这适用于只有一个标记的地图，但是当我使用地图功能发送多个标记的坐标时，单击其中任何一个都会打开所有弹出窗口，因为绑定状态控制它们所有。如何设置它以便只显示与特定标记相关的弹出窗口？// stateconst [popupOpen, setPopupOpen] = useState
2021-08-14
我正在使用react-map-gl向我的 React 应用添加地图。我想向我的Layer组件添加onClick事件，但react-map-gl似乎不支持它。 （文档在此处：https://visgl.github.io/react-map-gl/docs/api-reference/layer）我最近发现react-mapbox-gl确实支持Layer组件的onClick事件，但我无法通过npm安
2022-03-25
我已经使用 Mapbox Studio 创建了 Mapbox 样式并将其设置为在 WMTS 上使用。样式的 URL 为：https://api.mapbox.com/styles/v1/username/styleId/wmts?access_token=token其中styleId、username和token是变量字段。当我尝试使用上述 URL 在 OpenLayers 中创建 WMTS 图层
2018-11-30