问题标签 [react-leaflet]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
616 浏览

react-leaflet - react-leaflet 是否支持非默认 CRS?

据我所知,react-leaflet不支持使用除Leaflet默认值(EPSG:3857)之外的坐标参考系统(CRS )。是这样吗?

react-leaflet的文档不包含对 CRS 的引用。

从我在 source中看到的内容来看,该Map组件通过了道具,但对我来说,实例化Leaflet.CRS带外并通过它是否会起作用(或者它是否是一个“好主意”TM)并不明显。

0 投票
0 回答
301 浏览

ssl - 我如何使用带有 https 的 react-leaflet?

是否可以将 react-leaflet 与 https 连接一起使用?

看来我无法在 HTTP 和 HTTPS 协议之间切换,所以我收到警告:

混合内容:“ https://localhost/map ”页面通过 HTTPS 加载,但请求了不安全的图像“ http://b.tile.osm.org/10/510/340.png ”。此内容也应通过 HTTPS 提供。

也许有人知道解决方法。

0 投票
1 回答
327 浏览

reactjs - react-leaflet 1.x + create-react-app:标记图像上的404

我尝试使用react-leaflet(在版本 1.0.0-rc.2 中),create-react-app但标记图像在 404 中。

生成的图像 src 是http://{server_host}:3000/static/media/marker-icon.2273e3d8.png")marker-icon.png

如果我删除奇怪")marker-icon.png的,图像是好的。

我对阴影图像遇到了同样的问题,但无法猜测“真实”图像 src。

您可以在此处重现该错误并此处查看代码

谢谢

0 投票
16 回答
43609 浏览

javascript - 反应传单地图未正确显示

我正在尝试使用react-leaflet来显示地图。我使用这个小提琴中的代码正在工作,但在我的电脑上我有这个输出

在此处输入图像描述

这是我的代码:

DeviceMap.js

DeviceTabs.js

样式.scss

控制台没有错误,我也不知道在哪里搜索。由于小提琴正在工作,因此它不是错误。我错过了什么 ?

0 投票
3 回答
7298 浏览

javascript - react-leaflet:如何根据 geojson 设置缩放

我正在使用 react-leaflet,到目前为止我的地图显示良好。我也成功地用来<GeoJson>覆盖多边形。

我目前已经硬编码了我的中心和缩放值,但我希望设置我的默认缩放,以便整个 GeoJSON 多边形可见。我正在为我在网上找到的文档/答案而苦苦挣扎(我只是初学者/中级 JS)。

这是我的组件:

更新:

当我使用 React 开发工具时,选择我的<MapHolder>组件,切换到控制台,然后运行

$r.refs.foo.leafletElement.fitBounds($r.refs.geojson.leafletElement.getBounds());

一切都按预期工作。但是,在我的代码中

this.refs.foo.leafletElement.fitBounds(this.refs.geojson.leafletElement.getBounds());

返回Uncaught TypeError: Cannot read property 'leafletElement' of undefined

我好近!我错过了什么?

0 投票
1 回答
896 浏览

reactjs - React 和 Leaflet - 显示图层的问题

我正在尝试在 React 项目中使用 Leaflet。我的目标实际上是非常基本的:只显示一个 openstreetMap 图层(没有标记或东西)

这是我的代码:

每次我有显示地图的保存问题时:它看起来像这样:(并非所有图块都显示,它们是叠加问题): 截图

有人面临这个问题或有任何解决方案吗?

感谢您的帮助

0 投票
0 回答
340 浏览

javascript - 如何在服务器端过滤 JSON/GeoJSON 数据?

我有两个从 overpassturbo-eu 提取的大型 json/geojson 文件。

我正在尝试在 OSM 上将此数据集绘制/添加为图层。

我需要过滤不同缩放级别的数据集。

这些文件太大,无法有效下载整个文件以对数据集进行客户端分析。

有没有一种有效的方法在服务器端过滤这些数据集?

0 投票
1 回答
10705 浏览

reactjs - 如何使用 react-leaflet 获得界限

我想获取当前地图的边界,以便可以使用 Overpass API 搜索这些边界。

对于传单,我知道该方法只是 map.getBounds(),但我不知道如何在 react-leaflet 中实现它。

这是我尝试过的。错误说这this.refs.map.getBounds不是一个功能。

0 投票
1 回答
282 浏览

javascript - 传单插件仅在启用地理定位时工作

我正在使用带有反应传单的传单。启用地理定位时,OverpassLayer 正在工作。当地理定位因为我在本地主机上而被阻止时,应用程序甚至没有进入 OverpassLayer 组件。

应用程序.js

OverpassLayer.js

0 投票
1 回答
921 浏览

javascript - 将 AnimatedMarker 插件与 react-leaflet 结合

我之所以选择这个插件,是因为它似乎是在地图多段线上为标记设置动画的最佳方式。

它不在 npm 上,所以我只是module.exports = L.animatedMarker从存储库中添加到 AnimatedMarker.js 并需要它。

应用程序.js

AnimatedMarkerElement.js

错误是:

我认为该插件正在寻找一个它找不到的地图,因为它隐藏在反应元素中。