Is there a way to retrieve the objects generated by DirectionsRenderer on Google Maps V3?

Is there a simple method to access the objects and properties of the markers and infowindows that are generated by the DirectionsRenderer? (such as the "A" and "B" endpoints of the route)

I want to swap out the infowindows for the "A" & "B" markers with ones that I have customized (with changing content) from a different marker that is not part of the route.

I have attempted to transfer the content from the old infowindow to the new one on the route like this, but it does not display correctly due to too many parent divs and styling restrictions:

//infowin refers to the infowindow linked to the marker    
result.routes[0].legs[0].end_address = MarkersArray[i].infowin.getContent();

Many thanks, E

javascriptgoogle-mapsgoogle-maps-markersinfowindow

Answer №1

I am currently working on solving a similar issue and have not been able to find a standard way to retrieve the default start or end icon.

One workaround is to disable the icons for the route and customize a marker instead.

var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

var image = 'beachflag.png';
var myLatLng = new google.maps.LatLng(-33.890542, 151.274856);
var beachMarker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    icon: image
});

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

Ways to create a URL path that is not case-sensitive in NextJs using JavaScript

I am currently working on a project using NextJs and I have encountered an issue with URL case sensitivity. The paths fetched from an API all start with a capital letter, causing inconsistency in the URLs. For instance, www.mysite.com/About. I would like t ...

javascriptreactjshttp-redirectnext.jscase-insensitive

Can you explain the relationship between HTML 5 Canvas coordinates and browser pixels?

When trying to use HTML 5 canvas as a drawing board in my application, I encountered an issue. The drawings appear at an offset from the mouse pointer. My method involves using the Jquery .offset function to determine the event's position on the canv ...

javascriptjqueryhtmlhtml5-canvasdom-events

What is the best practice for importing React components?

In my experience with React, I've noticed two different ways of importing and extending components. The first way that I typically use is shown below. import React from 'react'; class SomeClass extends React.Component { //Some code } ...

javascriptreactjscomponents

"Enhance your web application with dynamic drop-down selection using Spring, Ajax

In my JSP file, I have a script that populates the list of states based on the selected country. The script fetches data from the controller and is supposed to display the list of states. However, after calling the controller method, the alert "received da ...

javascriptajaxjsonspringjackson

Using JavaScript to Redirect to Homepage upon successful Ajax response on local server

I need assistance with redirecting to the Homepage from the SignIn Page once the user credentials have been validated. The response is working correctly, and upon receiving a successful response, I want to navigate to the Homepage. My setup involves Javasc ...

javascriptphpajaxhttp-redirectauthentication

Adjustable Scroll Bar

Could anyone help me find a component similar to the resizable scrollbar on Google Finance? Check out this link: http://www.google.com/finance?q=EURUSD&ei=bhM_UKDXF-aIWqAPVNQ You can see it below the chart. If you know where I can find something like ...

javascriptcomponents

Using ExpressJS to generate a page with inputs

Using ExpressJS, I have created an Object of the IndexController in my router (index.js) and passed a String as a constructor argument. I then attempted to call the showDefaultFeed method. Expected output from "index.hbs" view was to print the argument pa ...

javascriptnode.jsexpress

Strangely unusual issues with text input boxes

So I've set up two textareas with the intention of having whatever is typed in one appear simultaneously in the other. But despite my best efforts, it's not working as expected. Here's the code snippet: <script> function copyText () { ...

javascript

In the present technological landscape, is it still considered beneficial to place Javascript at the bottom of web pages?

As a beginner in web programming, I've recently delved into Javascript. A hot debate caught my attention - where should javascript be placed, at the top or at the bottom of a webpage? Supporters of placing it at the top argue that a slow loading time ...

javascripthtml

Mastering the art of grouping by a key and generating sub-objects from a plain array of key-value pairs in JavaScript ES5 without relying on third-party libraries

My dataset consists of an array of objects, each containing 4 keys: [ { "team": "USA", "team_profile_id": "10", "player": "Captain America", "player_id": "10X1" }, { "team": "USA", "team_profile_id": "10", "player": "The ...

javascriptarraysjsonobjectecmascript-5

Is it possible to eliminate auxiliary routes in Angular 4?

Recently, I came across an interesting scenario with two <router-outlet> tags, one with a name property. To test this, I set up the following router mapping: export const routing = [ {path:'', pathMatch:'full', component:E ...

javascriptangularangular2-routing

String casting for large JavaScript integers may require rounding to function properly

When trying to pass a large integer to a function from an onclick event in HTML, I always encounter issues with rounding. Despite using bigInt libraries, I still struggle to pass the full number accurately and would prefer a simple string casting method. ...

javascripthtmlbigint

Managing and comparing category IDs in JavaScript to effectively store and render subcategories

My goal is to set the current category ID in a variable, and if the category changes, I want to store that as well. Then, I need to compare both IDs. If they are not equal, I want to set the subcategory to null. However, I am unsure of where my mistake lie ...

javascriptjquery

Adding properties to Vue.js component in the script section without affecting rendering

How can I import component A with props and pass it to another component B for rendering? import MyComponent from '/MyComponent.vue' computed: { compnt: function () { var comp = MyComponent // How can I set props to MyC ...

javascriptvue.jsvuejs2

Dynamically attach rows to a table in Angular by triggering a TypeScript method with a button click

I need help creating a button that will add rows to a table dynamically when pressed. However, I am encountering an error when trying to call the function in TypeScript (save_row()). How can I successfully call the function in TypeScript and dynamically a ...

javascriptangulartypescriptangular5

How can the Flickr API be utilized with JavaScript functions?

In preparation for a project, we are required to utilize the Flickr API in order to display a collection of photos when a specific category is selected. I have successfully set up my categories on the left side of a flexbox container. However, I am struggl ...

javascriptjqueryhtmlcssflickr

Discovering the country associated with a country code using ngx-intl-tel-input

In my application, I am trying to implement a phone number field using this StackBlitz link. However, I have observed that it is not possible to search for a country by typing the country code (e.g., +231) in the country search dropdown. When I type a coun ...

javascriptangulartypescriptngx-international-phone-number

Encountering Issues with Formatting InnerHtml Text using RegEx

Technology: React.js I have been working on a custom function in JavaScript to highlight specific words within a code block. The function seems to be functioning correctly, but the highlighting isn't staying after the function is completed. Any ideas ...

javascriptjqueryhtmlcssregex

Creating automatic page additions using Node.js on Heroku?

Can you assist me with a challenge I'm facing? Currently, I am using node.js and heroku to deploy an application and each time I add a new post, I have to manually update my web.js file. This process was manageable when I had fewer pages, but now it&a ...

javascriptnode.jsheroku

If I use npm install to update my packages, could that cause any conflicts with the code on the remote server?

As I navigate through the numerous issues, I stumbled upon the command npm ci that is supposed to not change the package-lock.json file. However, when I attempt to run npm ci, it fails: ERR! cipm can only install packages when your package.json and package ...

javascriptnpm