Example of issue The above link is a video of my issue along with a photo of my relevant code. React is not immediately loading all of the map markers every time it loads. Sometimes all of the markers load, sometimes only 1 does and I have to click on the navigation bar link for ..
Category : react-leaflet
I have wrote a React project with react-leaflet and hook. My goal is to move and rotate marker every second. However, moving part is working fine. But the rotation of marker is not working. I am really stuck for last few days. I couldn’t find a good solution. Please help me. The map component is ..
I get details of an ellipse to show on my map, and am using the ellipse plugin shown on the leaflet webpage to do this, this states the correct way is as follows: L.ellipse([lat, lng], [semi-major, semi-minor], tilt).addTo(map); My issue is I get given the tilt in degrees clockwise from the North, whereas the plugin ..
I have a map that displays a marker for every diferent public facilities in a city and I want to have a group of checkboxes to filter this facilities according to its typology, one checkbox for typology. Each typology will have multiple markers and the map will only show the checked ones. I’m using react-leaflet ..
My React Typescript app is displaying a Leaflet map with marker clusters using react-leaflet & react-leaflet-markerclusterer. However, I am unable to get the map to show all cluster markers inside the map view. I am attempting to convert this JS solution to Typescript. One of the errors shown in the. JS console is React Hook ..
I’m using React leaflet 3.1.0 and I want to display a legend in the map. I built a component for the legend and pass map instance that I get from MapContainer whenCreated({setMap}). Map Component: import { useState } from ‘react’; import { MapContainer, TileLayer } from ‘react-leaflet’; import ‘./Map.css’; import Legend from ‘./Legend/Legend’; const INITIAL_MAP_CONFIG ..
I’m trying to implement functionality which will allow me to, when placing a marker with leaflet-editable, hold control while clicking to place a marker before immediately initializing another marker to be placed. The result would be that the user could hold control to rapidly place several markers in a row. I have attempted to implement ..
I am trying to pass an additional property count into the Marker component provided by react-leaflet. However, we are getting an error Type ‘{ children: Element; position: [number, number]; key: number; count: number; }’ is not assignable to type ‘IntrinsicAttributes & MarkerProps & RefAttributes<Marker<any>>’. Property ‘count’ does not exist on type ‘IntrinsicAttributes & MarkerProps & ..
I am working on react.js using the leaflet library and I would like when I click on the map moving the marker and not add a new marker. Here is my code : import React from "react"; import { MapContainer, TileLayer, useMapEvents, MapConsumer } from "react-leaflet"; import "leaflet/dist/leaflet.css"; import L from "leaflet"; import icon from ..
Is it possible to change the tile size of Mapbox tiles when using react-leaflet? The rendered tiles has text that look too tiny, which makes me think that these are 512px tiles being treated by Leaflet as 256px tiles. I am experiencing this on an external monitor connected to a Macbook Pro (with Retina screen). ..
Recent Comments