react-leaflet相关内容

带有Reaction的传单地图上的自定义按钮-传单版本3

我是Reaction打字稿的新传单学习者。我想在地图上创建自定义按钮。点击该按钮后,将出现弹出窗口。我看到了很多例子,但它们都是基于旧版本,我也试图创造自己的,但没有运气。文档也没有提供太多帮助。对于我的应用程序来说,即使是一个功能强大的自定义控件组件也非常有效。在这方面的任何帮助都将不胜感激。以下是我的代码 自定义按钮 import React, { Component } from ..
发布时间:2022-04-12 21:58:49 其他开发

使用Reaction-Leaplet-Draw in Lamlet创建新图层之前删除图层

我这里的目的是在地图上只允许一个多边形。我的方法是在onCreated方法期间将新图层保存在变量或数组中,并在onDrawStart获取并删除方法中保存,所以一旦用户尝试绘制另一个形状,前一个将被移除,但这不起作用,有什么建议如何实现这一点吗? onCreated = (e) => { coordinates = e.layer._bounds; layer.push(e.layer ..

反应传单和反应-传单-抽签

我正在尝试实现传单地图上的绘制功能。我使用npx create-reaction-app和以下安装的软件包创建了一个仅安装了REACTION-LEAFLET的新应用程序: NPM安装Reaction-dom宣传单 NPM安装Reaction-宣传单 此时,我已经启动了应用程序,一切工作正常:地图显示正确,中间有一个标记。 然后我添加了REACTION-LEAFLE-DRAW包, ..

Leaflet React在功能组件中获取地图实例

我想在地图外有一个按钮,可以将视图更改为另一个坐标. 有没有办法让 mapContainer 实例调用它们的函数?或者我该如何实现这个功能? 我试图通过使用 ref 来获取它,但它不起作用.这是我当前的代码 const zoom = 13;功能地图({区域坐标,区域名称}){常量 mapRef = useRef();函数句柄FlyToClick() {//这不起作用//const m ..
发布时间:2022-01-12 18:41:43 前端开发

如何在 api 调用时使用 react-leaflet 添加多个标记?

在我之前的问题的上下文中,MapContainer, TileLayer, Marker, Popup .. React Leaflet 如何添加多个地点标记 用例是,当自行车从一个地方到另一个地方时,我需要展示骑自行车的人走过的距离. 解决方案 这里是例子.在 MapsComp 上: 声明一个状态变量来跟踪标记 在 comp 挂载时获取标记并将它们保存到变量中 ..
发布时间:2022-01-12 18:34:09 其他开发

如何在 react-leaflet 中调用 fitBounds 和 getBounds?

我不知道如何在 Leaflet 地图上调用 fitBounds(). 基本上,我试图在地图上显示多个标记并相应地调整视图(放大、缩小、飞到等).我还看到了一些示例 使用时如何调用 fitBounds()传单反应? 我试图实施,但没有奏效.这是我尝试过的代码. import React, { createRef, Component } from "react";进口 {地图,瓦片层,标记, ..
发布时间:2022-01-12 18:31:57 前端开发

react-leaflet 创建自定义组件

我想创建一个带有显示鼠标实际位置 (x,y) 的 react-leaflet 的自定义组件,但我不知道如何创建它.我找到了 react-leaflet-control 但它似乎不是最新的,当然我阅读了 api 文档 https://react-leaflet.js.org/docs/en/custom-components.html 但我不明白:/ 谁能给我一个自定义组件的例子,只要一个显示 ..
发布时间:2022-01-12 18:15:03 前端开发

带有反应传单的自定义标记图标

我尝试了我在网络上找到的所有东西,Stackoverflow 和 Github,但仍然无法成功. 我想使用自定义图标制作自定义标记,但使用下面的代码时总是出现错误:'TypeError: options.icon.createIcon is not a function' 这是我的代码(文件夹路径没有错误,一切都在 src/js 或 src/img 中) 图标.js 从'lea ..
发布时间:2022-01-12 18:08:38 其他开发

从打字稿文件中的“react-leaflet"将“onClick"功能添加到 MapContainer

在 Typescript 文件中,我无法从 'react-leaflet' 导入 'Map' 并使用 'MapContainer' 轻松修复它.但是,我需要为其添加一个“onClick"功能,但“MapContainer"不支持“onClick".我遵循了文档,但它导致我遇到了新的/其他问题......我只需要添加一个简单的 onClick 函数,以使用户能够在此类地图上通过鼠标单击来标记位置.有 ..
发布时间:2022-01-12 18:05:08 其他开发

如何使用 react-leaflet 获得界限

我想获取当前地图的边界,以便我可以使用 Overpass API 搜索这些边界. 对于传单我知道方法只是 map.getBounds(),但我不知道如何在 react-leaflet 中实现. 类 SimpleExample 扩展 React.Component {构造函数(){极好的();这个.state = {纬度:51.505,液化天然气:-0.09,缩放:13,};}组件DidMo ..
发布时间:2022-01-12 18:03:39 其他开发

未找到 React-Leaflet 标记文件

我有非常简单的代码来使用 react-leaflet 显示地图并在其上放置一个标记.但是,我在浏览器控制台中收到以下两个错误 GET http://localhost:8080/marker-icon-2x.png404(未找到) GET http://localhost:8080/marker-shadow.png 404(未找到) 我尝试通过下载这两个图像并将它们放在根目录来 ..
发布时间:2022-01-12 17:58:40 前端开发

反应传单地图未正确显示

我正在尝试使用 react-leaflet 来显示地图.我使用 this fiddle 中的代码,它正在工作,但在我的电脑上我有这个输出 这是我的代码: DeviceMap.js 从'react'导入反应从'react-leaflet'导入{地图,标记,弹出窗口,TileLayer};导出类 DeviceMap 扩展 React.Component {构造函数(){极好的();这个. ..
发布时间:2022-01-12 17:56:57 前端开发

传单:找不到地图容器

我有下面的反应类,它通过浏览器获取地理位置. 我正在绘制一张传单地图.我想将地理位置作为 setView 的输入,以便地图“缩放"到客户端浏览器位置的区域. 这是反应类: 从'react'导入反应;从“传单"导入 L;从“./countries.js"导入国家;var Worldmap = React.createClass({渲染:函数(){让地理位置 = [];navigato ..
发布时间:2022-01-12 17:44:38 前端开发

如何修复错误“编译失败:./node_modules/@react-leaflet/core/esm/path.js 10:41 模块解析失败:意外令牌(10:41)"

我正在尝试创建一个 react-typescript 应用程序以及 leaflet.我用了命令, npm install leaflet react-leaflet @types/react @types/leaflet --save 安装依赖. 但是当我启动应用程序时,它说, ./node_modules/@react-leaflet/core/esm/path.js 10:41 ..
发布时间:2022-01-12 17:40:45 前端开发

如何修复错误“无法编译:./node_modules/@react-leaflet/core/esm/path.js 10:41 Module parse failed: Unexpected token (10:41)"

我正在尝试创建一个 react-typescript 应用程序以及 leaflet.我使用了命令, npm install Leaflet react-leaflet @types/react @types/leaflet --save 安装依赖项. 但是当我启动应用程序时,它说, ./node_modules/@react-leaflet/core/esm/path.js 10: ..
发布时间:2021-12-02 10:31:54 前端开发