Polyline straight instead of snapping to road on Ruby app

I have added the following code to display a map and draw a path on it. There could be many points to display (So start, waypoints and end). The points are all in a table Location which has both latitude and longitude fields. I am not sure how to pass the information so that the table shows up and the path connected the different stops

<script>
    var map_options = {
        center: new google.maps.LatLng('<%= current_user.latitude %>', '<%= current_user.longitude %>'),
        zoom: 16,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        panControl: false,
        mapTypeControl: false,
        zoomControlOptions: { position: google.maps.ControlPosition.LEFT_CENTER }
    };

    var map = new google.maps.Map(document.getElementById("map-canvas"), map_options);
    var apiKey = '<%= Rails.application.secrets.google_secret%>';

    function processSnapToRoadResponse(data) {
        snappedCoordinates = [];
        placeIdArray = [];
        for (var i = 0; i < data.snappedPoints.length; i++) {
            var latlng = new google.maps.LatLng(
                data.snappedPoints[i].location.latitude,
                data.snappedPoints[i].location.longitude);
            snappedCoordinates.push(latlng);
            placeIdArray.push(data.snappedPoints[i].placeId);
        }
    }

    function drawSnappedPolyline() {
        var snappedPolyline = new google.maps.Polyline({
            path: snappedCoordinates,
            strokeColor: 'black',
            strokeWeight: 3
        });

        snappedPolyline.setMap(map);
        polylines.push(snappedPolyline);
    }



    function runSnapToRoad(path) {
        var pathValues = [];
        for (var i = 0; i < path.getLength(); i++) {
            pathValues.push('???????????????????');
        }

        $.get('https://roads.googleapis.com/v1/snapToRoads', {
            interpolate: true,
            key: apiKey,
            path: pathValues.join('|')
        }, function(data) {
            processSnapToRoadResponse(data);
            drawSnappedPolyline();
        });
    }






</script>

Does anybody knows how to pass the array of longitude/latitude? I have checked the following links: http://www.kadrmasconcepts.com/blog/2013/06/28/drawing-polylines-with-rails-and-google-maps/ This one does not show how he gets the path, as a result when using his path it is fine, but when creating my own path, I get a straight line.

https://developers.google.com/maps/documentation/roads/snap This is the current code that I used.