leaflet 相关问题

如何获取传单WMS地图最近的特征？

我对 Web 服务还很陌生，我遇到了一个问题。 我有一张与 WMS 链接的地图。 我添加了底图和 WMS 日期作为tileLayer，并在我的地图上正确显示。 现在我想要最近的

传单中的 Graphopper 选项

我有一个传单地图，使用graphopper作为路由器。我在设置选项时遇到问题；例如，将车辆从默认（汽车）更改为摩托车。 路线控制 = 新 L.Routing.C...

如何在nextjs中使用tailwind从react-leaflet中设置弹出窗口的样式

我正在尝试使用顺风在地图中设置弹出窗口的样式，但样式没有反映。 const 自定义图标 = divIcon({ html: ` 我正在尝试使用顺风在地图中设置弹出窗口的样式，但样式没有反映。 const customIcon = divIcon({ html: ` <svg width="54" height="55" viewBox="0 0 54 55" fill="none" xmlns="http://www.w3.org/2000/svg" > <g clip-path="url(#clip0_817_1163)"> <path d="M27.0001 54.2632C27.0001 54.2632 8.1001 29.6122 8.1001 19.1632C8.1001 16.6812 8.58896 14.2235 9.53877 11.9305C10.4886 9.63741 11.8808 7.55389 13.6358 5.79887C15.3908 4.04384 17.4743 2.65167 19.7674 1.70186C22.0604 0.752047 24.5181 0.263184 27.0001 0.263184C29.4821 0.263184 31.9398 0.752047 34.2328 1.70186C36.5259 2.65167 38.6094 4.04384 40.3644 5.79887C42.1194 7.55389 43.5116 9.63741 44.4614 11.9305C45.4112 14.2235 45.9001 16.6812 45.9001 19.1632C45.9001 29.6122 27.0001 54.2632 27.0001 54.2632ZM27.0001 24.5632C28.4323 24.5632 29.8058 23.9943 30.8185 22.9816C31.8312 21.9689 32.4001 20.5954 32.4001 19.1632C32.4001 17.731 31.8312 16.3575 30.8185 15.3448C29.8058 14.3321 28.4323 13.7632 27.0001 13.7632C25.5679 13.7632 24.1944 14.3321 23.1817 15.3448C22.169 16.3575 21.6001 17.731 21.6001 19.1632C21.6001 20.5954 22.169 21.9689 23.1817 22.9816C24.1944 23.9943 25.5679 24.5632 27.0001 24.5632Z" fill="#1B1130" /> </g> <defs> <clipPath id="clip0_817_1163"> <rect width="54" height="54" fill="white" transform="translate(0 0.263184)" /> </clipPath> </defs> </svg>`, popupAnchor: [140, 126], }); <MapContainer center={[48.8566, 2.3522]} zoom={10} scrollWheelZoom={false}> <TileLayer attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" /> <Marker position={[48.8566, 2.3522]} icon={customIcon}> <Popup className=""> <h2 className="">hi how are you?</h2> <p className="">welcome to paris</p> </Popup> </Marker> </MapContainer> 我试图向整个弹出窗口添加背景颜色，但颜色没有反映到整个弹出窗口。 您找到解决方案了吗？ 我也有同样的问题。

如何将react-leaflet地图添加到remixjs应用程序

我正在尝试将反应传单地图添加到混音应用程序中。我使用 npx create-remix@latest 命令创建了一个简单的应用程序。然后我使用安装说明添加了react-leaflet。现在我有...

如何在 JavaScript 中正确读取 geoJSON 文件？

我正在使用 Leaflet 和 OpenStreetMap 在我的页面上显示地图。我按照步骤在页面上创建了一个简单的地图。一旦我能够生成地图，我就会按照创建 geoj 的步骤...

将 SVG 叠加在传单 latLngBounds 上

我正在使用 Plotly 生成 SVG 等值线图。随后，我的目标是将这个 SVG 轮廓叠加到具有特定边界的地图上。我的目的是调整 SVG 的大小以适应这些边界，si...

无法将WMS图层添加到R Leaflet

我想用这个wms服务在R中制作传单地图：https://data.geopf.fr/wms-r/wms?VERSION=1.3.0 它在 QGIS 中运行良好，但在 addWMSTiles 中运行不佳。 图书馆（传单） 层=“ADMINEXPRESS-COG...

使用 leafpm 在闪亮的应用程序中处理多边形编辑

我正在开发一款闪亮的应用程序，它可以让用户使用“leafpm”包在传单地图上交互地绘制多边形，计算森林生物特征，报告它们，并使这些多边形可用...

在矩形上绘制传单会引发错误

我在 Angular 应用程序中使用 leaflet + leaflet-draw + @ngx-leaflet + @ngx-leaflet-draw 。 我已经尝试了一切，版本更改，导入模块 .forRoot() 而不是，添加 js 文件...

将 shapefile 从 Dropbox URL 读取到 R 中的 Shiny 应用程序中？

我有一个 shapefile 存储在 Dropbox 文件夹中，我想在 Shiny 应用程序中显示它。我可以从 Dropbox 下载 URL 下载 .zip 文件，解压缩该文件，然后读取 .shp 文件...

Leaflet geoJson 和 Mysql，如何优化极慢的查询

我需要创建一个geoJson多边形图层，数据位于mysql数据库中，它指的是一个国家的区域。具体来说，我需要计算每个区域中的对象数量。我的地图显示了各个区域

根据更新的坐标平移/将Leaflet地图移动到新位置/单击

我已经很接近这个目标了，但我糟糕的 Javascript 让我失望了。 我一直坚持向 Leaflet 地图添加事件侦听器 addListener() 或 on() 来移动地图。 在我的非营利性古代网站上...

如何使用传单、闪亮的应用程序在地图上显示路径和距离？

我想在闪亮的应用程序中使用传单包显示两个位置之间的距离。 我不知道该怎么做。一条线应连接地图上的两点并在其上显示距离。

如何为沿路线的自定义传单标记设置动画？

我对传单非常陌生，我希望有人可以帮助我。 我想做的是在地图上添加两个标记，并让另一个标记沿着路线走。 我发现了一些插件...

appendContent 不能在 Shiny 渲染调用中使用

leaflet.extras 中的函数 addSearchGoogle 在 Shiny 应用程序中抛出此错误： renderWidget(instance) 中的警告：忽略附加内容； 不能在闪亮渲染中使用appendContent

带有react-leaflet的平滑滚动

我正在尝试在我的反应传单项目中创建平滑的缩放。 我知道这对于原版传单是可行的，如本文中所述，使用 smoothWheelZoom，但知道原版传单不...

我怎样才能有一个带有按钮的控制层？

我是 javascript 和传单的新手。我有一张传单地图，其中有两个 geotiff 图像，每个图像都在一个带有复选框和两个按钮的图层中表示，一个按钮用于转到 i...

ESRI leaflet featurelayer 渲染存在长时间滞后

我正在从传单上的以下 Web 服务器渲染流程： “https://watersgeo.epa.gov/arcgis/rest/services/NHDPlus_NP21/NHDSnapshot_NP21/MapServer/0”； 这是一个复杂的层，我

React-leaflet ImageOverlay 在使用 jspdf 导出的 PDF 中不可见

我正在使用react-leaflet v4.2.1。我用它来显示的不是地图而是这样的自定义图像 我正在使用 react-leaflet v4.2.1。我用它来显示的不是地图而是这样的自定义图像 <MapContainer center={[height / 2, width / 2]} crs={crs} bounds={bounds} minZoom={-5} zoomControl={false} attributionControl={false} > <HeatmapLayer /> // component created with leaflet.heat <ZoomControl position='bottomleft' /> <ImageOverlay url={url} bounds={bounds} /> </MapContainer> 工作正常。我想将这张地图导出为 pdf 格式。我正在使用 jspdf 库。 const doc = new JsPDF(); const heatmap = document.getElementById('heatmap-report')!; const data = await html2canvas(heatmap); const img = data.toDataURL('image/png'); const imgProperties = doc.getImageProperties(img); const pdfWidth = doc.internal.pageSize.getWidth(); const pdfHeight = (imgProperties.height * pdfWidth) / imgProperties.width; doc.addImage(img, 'PNG', 10, 150, pdfWidth - 10, pdfHeight); doc.save('my-file.pdf'); 问题是它只显示 HeatmapLayer 和 ZoomControl，而 ImageOverlay 不可见。 我还尝试使用 use-react-screenshot 库，它也只显示 HeatmapLayer 和 ZoomControl。 我必须将这个 ImageOverlay 与 HeatmapLayer 一起导出，就像用户在屏幕上看到的那样（因此包括缩放位置等），所以我需要使用传单。你有什么想法我该怎么做吗？ 我找到了解决问题的方法。我将 base64 而不是 url 作为 url prop 传递给 ImageOverlay 组件。 // before <ImageOverlay url={url} bounds={bounds} /> // now <ImageOverlay url={base64} bounds={bounds} /> 我认为这可能与CORS有关。

在原生Web组件中使用传单

我正在尝试在网络组件内使用传单。这是我的代码。 我已将标准示例复制粘贴到传单网站上，但给它一个 HTMLElement 而不是 id 字符串。 类 InfoWithMap