Question

it's a couple of days i'm struggling with this problem i cannot solve.

I have an Android application sending me a certain number of coordinates; each coordinate has a value related to it and what i need to do is to report this points on a map, visualizing different marker colors depending on this value.

I'm tryng to do it via Google maps API.

I have all the points stored in a fusion table and i'm able to build a layer with proper style, but the problem is that these points do not correspond on real streets on the map and it is obviously necessary that they do.

What i am tryng is to use the DirectionsService, as suggested here:(google maps geocoder - point on a street) and i know that gps cannot be so precise.

The way i tried til now is to put all my points in an array (without using the fusion table layer, cause i dunno how to connect the two tehings) and then for each point make a request to the DirectionsService (i know it's terribly slow, but for now i need it to be precise and if you have suggestions it's well accepted) but in this way only certain points are well represented while other have a null response from the service and are not reported at all.

Any suggestion?

var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var urbino = new google.maps.LatLng(43.72333292, 12.63552457);
  var mapOptions = {
    zoom:10,
    center: urbino
  }
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  directionsDisplay.setMap(map);
}

function calcRoute() {
  var start, end;

  var waypts = [new google.maps.LatLng(43.72333292,12.63552457), new google.maps.LatLng(43.72333292,12.63552457), new google.maps.LatLng(43.72333292,12.63552457), new google.maps.LatLng(43.72333292,12.63552457)............];


console.log(waypts.length);

    $.each(waypts, function(index){
        if(index < waypts.length -1){
            var request = {
              origin:waypts[index],
              destination:waypts[index+1],
              travelMode: google.maps.TravelMode.DRIVING    
            };


            directionsService.route(request, function(response, status) {
                console.log(index);
                console.log(response);
                if (status == google.maps.DirectionsStatus.OK) {
                  directionsDisplay.setDirections(response);
                  console.log('ok');
                }
                else{
                  console.log('non ok');
                }
            });
        }
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

$(document).ready(function(){

  calcRoute();
});

EDIT

Came out that supplied points were totally wrong (but that was not my job so i just took them), now with new points directionsService works fine even with just some waypoints. The problem still remains in part, even if much smaller, cause points supplied from the fusion table are not precisely on the street on all the route. So i still need to figure out how to put pieces together, meaning using the route of the directionsService, styled with the fusion table layer. :)

Was it helpful?

Solution

Used points were totally wrong, now with right set of coordinates, the path supplied by fusion Table is almost perfect, on all the streets long, even though there are some points not really on the streets.

So, what i have to figure out now is how to put fusionTable layer (styled) with directionsService (precise).

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top