EasyButton | Arduino library for debouncing momentary contact switches

I have a leaflet map with markers showing the top cities in a chosen country. When a marker is clicked, the lat/lng of that city is used in an AJAX call and a modal displaying weather information for the city pops up through use of a PHP cURL routine to a weather API. A couple of easyButtons appear after this click event fires.

I would now like to add another modal containing different info for the same city that will pop up when the user clicks one of these easyButtons, by using another API that utilises the same lat/lng values as used in the weather call.

I am cautious that my main function is now getting very long and complex. Additionally, I'm aware that the $cityMarker click function wouldn't work for this new modal/easy Button as it requires a new click. Therefore I think it would be best to create a separate function.

Is there a simple way to be able to access the lat/lng values in the AJAX call for use outside the function scope - i.e. when the user clicks the new easyButton the lat/lng data from the current marker can be used? Or any other suggestions as to how I can achieve this functionality?

Any help is much appreciated - thank you!

JS:

Does anyone know of a way to change the state of an easyButton inside the server function of an R Shiny app?

I'm trying to create an easyButton instance that changes the value of a dropdown list to a specific option. The method I am using to change the option value works outside of the easyButton instance elsewhere in the code. The easyButton also prints out the expected values to the console and otherwise works fine. If used to call another function, that function executes, but still does not change the dropdown list value. I'm really unsure why this is occuring and how to fix. Simplified code snippets are is as follows:

HTML; Dropdown list

I am trying to use geoman-io plugin (https://github.com/geoman-io/leaflet-geoman) in ngx-leaflet application. I've found this post: Integrate EasyButton, Geoman with ngx-leaflet , but the only solution provided in this post, that works for me, is to use bracket notation like that:

map["pm"]["addControls"]({position: 'topleft'});

I guess that's not the best way to do this. So my question is how to properly use geoman-io in ngx-leaflet?

When i tried exactly these steps, it doesn't work, because at map.pm.addControls({...}) i get error

Property 'pm' does not exist on type 'Map'

Steps:

1. npm i @geoman-io/leaflet-geoman-free
2. Import geoman in the component import '@geoman-io/leaflet-geoman-free';
3. In angular.json in "build" section import geoman styles:

I've been working on a map component that renders points of results that stream in from search. I have gotten most of it working, until I began passing props in for the return statement. I'm using my own component, not react-leaflet's . I've noticed if I use and render with props.locations.map( ... it works fine. If I reference my map = L.map(...) with and try to render with props, it breaks as soon as it attempts to create the layer and add it to the map.

The component's JS File is as follows:

I need to add a button like a home that resets the map. I used the Leaflet.EasyButton but It doesn’t show on my map. It doesn’t even show any error in the console.

I am trying to add an easyButton with a flyTo function within a shiny app in R.

When the user presses the button, it will fly to the current location (lat/long). I am using a reactivePoll to poll a boat instrument simulator every 5 seconds (NMEA simulator), which is where the lat/long come from. A path is also drawn by using addCircleMarkers. I want to keep this path drawn, and the flyTo button to pan and zoom to the current location without refreshing the map, i.e. removing the path that was drawn.

In my current code with the flyTo button, with every poll the map refreshes. If I remove this code, the map does not refresh, so I think how I'm using the reactive within this button is the issue, but I'm not sure why. It may be because I have a reactive inside a reactive (All_NMEA() inside of renderleaflet()). The code of interest in the reprex is:

I have a component, OpenStreetMapComponent, which views my whole map. In the same component I also have a number of buttons (zoom, current location...). Having all of that in one component soon makes things unreadable so I would like to have the buttons in a different component. I do not know how to get access the map if the buttons are in another component though.

Below my OpenStreetMap Component:

I am trying to add an icon from mapkey to L.easyButton using the following code, but I am getting the error below.