编写此jQuery ajax调用的正确方法是什么

Question

I am trying to set up a google map that that pulls in GPS coordinates from database via ajax and draws a poly line on the map.

I have it working when the ajax call is removed, just using coord(lat_start,lng_start), and coord(lat_end,lng_end), it draws a line between lat_start,lng_start and lat_end,lng_end but when I try to wrap it in an ajax call, it says there is an error.

If possible, I would like guidance on how to write this block correctly.

SyntaxError: syntax error 'for(i = 0; i < arr.length; i++) {'

Thanks

//The vars are posted from hidden form values
var lat_start = $(this).parent('.plot_trip').find('.lat_start').val();
var lng_start = $(this).parent('.plot_trip').find('.lng_start').val();
var lat_end = $(this).parent('.plot_trip').find('.lat_end').val();
var lng_end = $(this).parent('.plot_trip').find('.lng_end').val();
var trip_id = $(this).parent('.plot_trip').find('.trip_id').val();

$.ajax({

    type: "GET",
    cache: false,       
    url: '?route=waypoints/get_by_trip_id',
    data: {trip_id:trip_id},
    success: function(data) {
        // have recieved
        alert('recieved data');     
        // set array var                
        var arr = data;     
        // set up google map polyline           
        polyline(map, [ 
            //set start gps coordinates 
            coord(lat_start,lng_start),
            //get and set all gps coordinates from array
            for(i = 0; i < arr.length; i++) { // Error shown here

                coord(arr[i].lat,arr[i].lng),

            }
            //set end gps coordinates
            coord(lat_end,lng_end),

        ]);                     
    }
});

Answer 1

Ok, so finally worked it out!

Posting my answer, which might be wrong but it works.

I needed to set up an array variable and push points to it.

Code is fully commented but if you have any questions, just ask :)

//The vars are posted from hidden form values
var lat_start = $(this).parent('.plot_trip').find('.lat_start').val();
var lng_start = $(this).parent('.plot_trip').find('.lng_start').val();
var lat_end = $(this).parent('.plot_trip').find('.lat_end').val();
var lng_end = $(this).parent('.plot_trip').find('.lng_end').val();
var trip_id = $(this).parent('.plot_trip').find('.trip_id').val();


$.ajax({

    type: "GET",
    cache: false,       
    url: '?route=waypoints/get_by_trip_id',
    dataType:"json",
    data: {trip_id:trip_id},
    success: function(data) {
        // have recieved
        alert('recieved data');
        // Set up points array variable
        var points = [];
        // set start gps position variable
        var start = coord(lat_start,lng_start);
        //push start gps position to points array variable
        points.push(start);
        //get all gps coordinates from array
        for(i = 0; i < data.length; i++) {
            // set point variable
            var point = coord(data[i].lat,data[i].lng);
            //push point to points array variable 
            points.push(point);
        }
        // set end gps position
        var end = coord(lat_end,lng_end);
        //push end gps position to points array variable
        points.push(end);
        //show polyline using array
        polyline(map,points);
    }
});