Discovering the exact latitude and longitude coordinates along a specific route using Google Maps

I've encountered a problem with finding the latitude and longitude along a given route using Google Maps DirectionsService. I have a JSON dataset containing latitude, longitude, and price details. My goal is to plot markers on the map and determine which points fall within the specified route, along with their corresponding prices. Below is the code snippet I'm currently using, any help would be greatly appreciated. Thank you!

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
<div class = 'map_div'>     
    <div id="map-canvas" style="float:left;width:100%;"></div>
</div>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
    var toll_details = '[{"id":"1","latitude":"-23.413133333","longitude":"-46.36105","price":"4.2"}, ... // Rest of the JSON data here

        });
        }
        finding(all_tolls)
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>
<style>
    html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
    }
    .map_div {
        border: 1px solid #CCCCCC;
        border-radius: 4px;
        float: left;
        height: 500px;
        margin-left: 4px;
        margin-top: 10px;
        padding: 10px;
        width: 700px;
    }
</style>

Answer №1

Construct a new polyline using the path that is returned (such as the overview_path), then loop through each of the tolls in all_tolls and utilize

google.maps.geometry.poly.isLocationOnEdge
to determine if a specific LatLng falls on or close to the polyline.

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

Disable the functionality of the next and previous buttons for the Bootstrap carousel when clicking on the outer

Here is the code for the carousel: The next/prev button functions under its respective div, how can I stop it? When I click on the div below the carousel, the carousel continues to move as usual. Below the carousel div, there is another one with a tabbi ...

Guide to extracting data from a JSON file using a PHP class

When I attempt to parse JSON data in the following format: { "bossresponse":{ "responsecode":"200", "web":{ "start":"0", "count":"50", "totalresults":"88300000", "results":[ { "date":"", "click ...

Express.js encounters an error when trying to parse JSON due to undefined body

I am working with a basic server that displays a JSON on the screen when it is posted. Below is my code snippet: /*jslint node:true*/ var express = require('express'); var app = express(); app.use(express.json()); app.use(app.router); app.post ...

Is ng-repeat failing to bind values in the Dom?

When loading data dynamically to ng-repeat, I am encountering an issue where the data is not binding to ul. Typically, this can happen with duplicate indexes, but in my case I'm unsure of what's causing it. Any suggestions? main.html <div> ...

The camera feature in Ionic Cordova seems to be malfunctioning

I am attempting to implement the ionic cordova camera feature. Here is the code snippet I have: HomePage.html <ion-view view-title="Example"> <ion-content> <img ng-show="imgURI !== undefined" ng-src="{{imgURI}}"> <img ng-s ...

The NextJS i18n feature is encountering an issue with the locale being undefined

Currently, I'm in the process of transitioning my website to NextJS, and I've run into some difficulties with internationalization. Even though I'm following the steps outlined in the official documentation, the locale displayed in the insp ...

Attempting to modify the background hue of a grid component when a click event is triggered

I am struggling with the syntax to change the color of an element in my grid when clicked. I have attempted different variations without success. Being new to JavaScript, I would appreciate some gentle guidance if the solution is obvious. JS const gri ...

Displaying the results of a SQL query in JSON format within a web API

My database contains multiple tables, and I have a single query that provides the desired output. However, when trying to display the query results in JSON format, instead of a single array, it shows collections. public class ValuesController : ApiC ...

Rendering Error - Animating text using React and Material-UI

Looking for a way to create a scrolling effect line by line? I have a component with name, pronouns, and some humble sub-text that should scroll one item at a time. To handle the scrolling feature, I've set up a separate component called TitleScroll. ...

What is the procedure for extracting data from a JSON encoded string in PHP?

I've been trying to get a value from JSON encode, but I can't seem to figure out what I'm doing wrong. Can someone please help me? I'm still new at this so please be patient :) Here's my PHP code: <?php $data = json_decode("do ...

My SF2 app is experiencing issues with AngularJS integration

I am currently developing a straightforward API using Symfony2 and now I am experimenting with integrating AngularJS into my bundle to visualize the results of my API calls. How can I effectively implement AngularJS? I initiated a bundle via app/console ...

Transitioning from Backbone to AngularJS - What challenges can be expected?

Currently I am deep into a large Backbone project (around 8000 lines of JavaScript, not counting external libraries) and I am contemplating making the switch to AngularJS. At the moment, a significant portion of my code deals with DOM manipulation, event ...

"Bringing together ECMA harmony: a nod to callbacks and generators

Initially, we are exploring uncharted territory here. Although it functions in the latest versions of Firefox, the documentation on MDN is not yet ready at the time of writing. I will address the MDN later on (maybe, as there are numerous areas needing att ...

Altering the text of dropdown items prior to the ASP.NET autopostback

Recently, I inherited a project from a client that is plagued with some irritating issues. One particular problem involves a dropdown menu that triggers an autopostback event upon selection change, inserting the selected text into a T-SQL query. The troubl ...

Interact with JSON data using CakePHP for posting and retrieving requests

Having difficulty posting and retrieving JSON data using CakePHP. In the view file, attempting to post data with code resembling the following: $.ajax({ type: "post", url: '/invoices/insertItem/', data: {'description': "th ...

Exploring the ways to access inner contents of a Div element using ajax

Looking to update the SQL database with a list of variables sent from an HTML page. Some data is being sent correctly, while others are not. The list is placed in a div divided into two parts: "h1" and another "div". The header data is being sent correctly ...

Error Unhandled in Node.js Application

I have encountered an issue in my NodeJS application where I have unhandled code in the data layer connecting to the database. I deliberately generate an error in the code but do not catch it. Here is an example: AdminRoleData.prototype.getRoleByRoleId = ...

Exploring the Dynamic Connection: AngularJS and MongoDB

As someone who is new to MEAN stack, I am currently working on creating a simple one-page application. My goal is to connect to MongoDB and retrieve values from a specific collection using a controller. During my search for an answer, I stumbled upon this ...

`I'm having difficulty transferring the project to Typescript paths`

I posted a question earlier today about using paths in TypeScript. Now I'm attempting to apply this specific project utilizing that method. My first step is cloning it: git clone <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cf ...

The sorting icon cannot be substituted with jQuery, AJAX, or PHP

Currently, I am working on implementing "sort tables" using ajax, jquery, and PHP. The sorting function is functioning correctly; however, I need to show/hide the "sorting images". At the moment, only one-sided (descending) sorting is operational because I ...