The addListener method in Google Maps iterates n times for a specific number of repetitions

When looking at the code below, the GetPropBasedOnRadius(); method loops for a certain number of times. I want to call that method only when the dragging event is completed. However, I am unsure how to do this.

Any assistance on this matter would be greatly appreciated.

google.maps.event.addListener(distanceWidget, 'distance_changed', function () {

    displayInfo(distanceWidget);
});


google.maps.event.addListener(distanceWidget, 'position_changed', function () {

    displayInfo(distanceWidget);
    GetPropBasedOnRadius();
});
javascriptgoogle-mapsgoogle-maps-api-3google-maps-markers

Answer №1

If everything else is in proper working order, I believe you just need to update your event handler from position_changed (which triggers continuously while the DistanceWidget is being dragged) to dragend (which only activates once dragging is stopped).

google.maps.event.addListener(distanceWidget, 'dragend', function () {
    displayInfo(distanceWidget);
    GetPropBasedOnRadius();
});

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to arrange the elements of an array based on a specified value?

Is there a way to develop a function that can organize an array of data based on the value of a specified field? Suppose the field consists of three numbers: 1, 2, 3. The idea is that upon providing a certain value to the function, it will rearrange the ta ...

javascriptarraysvue.jsvuejs3

What is the process for creating instant notifications using AJAX, PHP, and MySQL?

I am looking to implement real-time notifications on my website and have already set up the notification bar: <div class="alert alert-info alert-with-icon" data-notify="container"> <button type="button" aria-hidden="true" class="close"> ...

javascriptphphtmlmysqlajax

Error: Unable to assign value to property 'className' of undefined object

On my http://localhost:3000/renewal page, the code looks like this: import Link from 'next/link' export default function Renewal() { return ( <header> <Link href="/"> <a> Go to home page ...

javascriptreactjsnext.js

Switch out the name of multiple elements with mootools

Is there a Moo tool that can replace multiple element IDs? I currently have the following code: $$('myelement').each(function(el){ var get_all_labels = el.getElements('label'); var get_label_id = get_all_l ...

javascriptmootools

Tips for transferring the id from a delete button to a delete button in a popup dialog box

In my frontend application, there is a table where each row corresponds to an item. For every row, there is a "Remove" button that triggers a warning popup upon being clicked. The intention is to pass the item's ID in this popup so that if the user co ...

javascriptreactjsnext.jspopuptailwind-css

My Node/Express service seems to be generating a span in the logs, but I am unable to locate my service in the Ja

Currently, I am in the process of setting up Jaeger tracing for my Node.js microservice using Express.js. After adding a basic GET request handler in my Express app and hitting the endpoint via curl, I notice that a span is created in the logs. However, w ...

javascriptnode.jsexpressjaeger

What is the best way to assign a URL to an image source using a JavaScript variable?

I am working on a script that displays different image URLs based on the time of day using an if-else statement. I want to dynamically load these images in an img src tag so that a different picture is loaded for each time of day. I have defined variables ...

javascripthtmlsrc

Exploring the methods for retrieving and setting values with app.set() and app.get()

As I am granting access to pages using tools like connect-roles and loopback, a question arises regarding how I can retrieve the customer's role, read the session, and manage routes through connect-roles. For instance, when a client logs in, I retrie ...

javascriptexpressaclloopback

The outcomes of JSON.stringify and JSON.parse can vary

I am facing an issue with using JSON.stringify to create a JSON string from an Object. After saving the string into a file, I attempt to read the file and use JSON.parse to retrieve the object again. However, it seems that the process is not working as exp ...

javascriptjsonparsing

The GitHub process is ongoing and not ending

I have developed a GitHub workflow that utilizes a node script. To test it, I set it up to run on manual trigger. Below is the code snippet of my workflow file: on: workflow_dispatch: inputs: logLevel: description: 'Log level&apos ...

javascriptnode.jsfirebase-realtime-databasees6-promisegithub-actions

Locate the nearest date (using JavaScript)

Searching for the nearest date from an XML file. <?xml version="1.0" encoding="UTF-8"?> <schedule> <layout fromdt="2014-01-01 00:00:00" todt="2014-01-01 05:30:00"/> <layout fromdt="2014-02-01 00:00:00" todt="2014-01-01 05 ...

javascriptjqueryhtmldatedatetime

Similar Functionality to jQuery's .load() in REACT

I'm currently diving into the world of React, attempting to transition a PHP + jQuery Page to React (minus the jQuery). However, given the intricate complexity of the page, I won't be able to migrate everything at once. As a result, I need to sta ...

javascriptjqueryreactjs

Changing the color of the timePicker clock in material-ui: a step-by-step guide

I have been attempting to update the color of the time clock in my timeInput component (material-ui-time-picker) for material-ui, but unfortunately, it is not reflecting the change. Here is the code I am using: <TimeInput style ={heure} ...

javascriptcssreactjsmaterial-ui

Directive that can be reused with a dynamic item name in ng-repeat

I've developed a reusable directive similar to a dropdown, but this dropdown opens in a modal and is functioning well. The structure of my directive is as follows: <p-select items="deptStations" header-text="Select " text="Select departure..." te ...

javascriptangularjsangularjs-directiveangularjs-ng-repeationic-framework

Obtaining an address using latitudes and longitudes with React Google Maps

I created a map using the react-google-map plugin where users can drag the marker to get the latitude and longitude of a location. However, I am only able to retrieve the lat and lng values and not the address. How can I obtain the address as well? Take a ...

javascriptreactjsgoogle-mapsnext.jsreact-google-maps

How to retrieve the length of data in Angular without relying on ng-repeat?

I am currently working with Angular and facing a challenge where I need to display the total length of an array without using ng-repeat. Here is the situation: I have a default.json file: { { ... "data": [{ "name":"Test", "erro ...

javascriptangularjsangularjs-ng-repeat

Step-by-step guide on showcasing a quiz utilizing Magnific-popup and ajax

My goal is to create a functionality that allows users to easily download and view a quiz in a lightbox with just one click. I have successfully set up the ajax features and believe I am using Magnific-popup correctly, but for some reason, the lightbox is ...

javascriptjqueryajaxlightboxmagnific-popup

The response body in Superagent is unknown until the next line is executed

While working on testing my express API using Jest and Supertest, I encountered an issue that I cannot seem to resolve: const id = await request.post('/program') .send(body) .expect('Content-Type', /json/) .expect(201).body ...

javascriptnode.jsexpressjestjssuperagent

Having trouble loading this JSON data into my table

So I have a little challenge on my hands: I've got a JSON file with information about various books, each including details like title, author, and year of publication. The goal is to select an option from the list and display the chosen property in ...

javascriptjsonajax

Learn the steps to successfully rotate the custom icon in Material-Ui select without impacting its functionality and making sure it remains clickable

I've been trying to incorporate my own icon for the material UI select component. I successfully replaced the default icon using the "IconComponent" attribute in MU select. However, I'm facing issues with the new icon not rotating when the menu ...

javascriptcsssvgmaterial-uiicons