Php 在谷歌地图上为每个“点”生成新的多段线;日期“;来自mysql的值

Php 在谷歌地图上为每个“点”生成新的多段线;日期“;来自mysql的值,php,javascript,mysql,google-maps-api-3,Php,Javascript,Mysql,Google Maps Api 3,编辑: 过去几周我一直在努力解决我的问题。因为我是一个真正的初学者,我在工作过程中学习代码。。。我将试图澄清我的问题,希望能给我答案 正如我之前所问的:我正在开发一个基于谷歌地图API 3的web应用程序。GPS记录器正在Mysql服务器上向表中输入以下值:id、纬度、经度、日期、时间、用户id。我想创建多条唯一的多段线。对于每个日期组一条新的多段线 正如我所说,我已经取得了一些进展,但我不太确定我是否走上了正确的道路 现在我不确定我得到的是什么,只有几条多段线连接在一起,使它们成为一条大的多段

编辑: 过去几周我一直在努力解决我的问题。因为我是一个真正的初学者,我在工作过程中学习代码。。。我将试图澄清我的问题,希望能给我答案

正如我之前所问的:我正在开发一个基于谷歌地图API 3的web应用程序。GPS记录器正在Mysql服务器上向表中输入以下值:id、纬度、经度、日期、时间、用户id。我想创建多条唯一的多段线。对于每个日期组一条新的多段线

正如我所说,我已经取得了一些进展,但我不太确定我是否走上了正确的道路

现在我不确定我得到的是什么,只有几条多段线连接在一起,使它们成为一条大的多段线,或是相互重叠的几条多段线。。。 另一个问题是,使用这段代码,我似乎无法显示第一条“日期组多段线”


我已经在原始代码和>>下面发布了较新的代码,我不确定您为什么要在客户端执行此操作,但一种方法是为每个日期创建一个点数数组:

if (!points[date]) points[date] = [];
points[date].push(new google.maps.LatLng(
      parseFloat(markers[i].getAttribute("lat")),
      parseFloat(markers[i].getAttribute("lng"))));

然后从每个数组中创建唯一的多段线。

您需要多个
解码路径。看起来你只有一个。那是我一直在努力的部分。谢谢你的回答,这个解决方案对我来说似乎是正确的。不知何故,我无法填充多段线。我的points[date]数组似乎是空的,我不知道为什么。如果您提供了指向地图的链接来显示问题(或JSFIDLE),那么可能有人可以提供帮助。代码在本地服务器下运行,我没有使用JSFIDLE的经验。如果有帮助的话,我可以发布整个代码。BTY,当我使用以下命令测试数组中的日期值时:
var dateBgn=markers[0].getAttribute(“日期”);如果(dateBgn==date){points[i]=new google.maps.LatLng(parseFloat(marks[i].getAttribute(“lat”)),parseFloat(marks[i].getAttribute(“lng”);}
,也许有人能帮忙。链接或JSFIDLE的优点是,它可以通过防止复制/粘贴错误和问题来节省试图提供帮助的人员的时间,并且通常在简化问题时,您可以将问题发布到JSFIDLE上。我已经在上发布了有问题的代码。在隔离mysql部分之后,我将尝试在JSFIDLE上发布它。
var map = new google.maps.Map(document.getElementById('map'), myOptions);
var infoWindow = new google.maps.InfoWindow();

// Change this depending on the name of your PHP file
downloadUrl("output-xml.php", function(data) {
    var markerbgn=[];
    var markerend=[];
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    var routeNum = [];
    var mPoints =[]; 

    for (var i = 0; i < markers.length-1; i++) {

        var date = markers[i].getAttribute("date").split("-").join("");
        var dateAdv = markers[i+1].getAttribute("date").split("-").join("");
        var datePrv = [];
        var dateEnd = markers[markers.length-1].getAttribute("date").split("-").join("");
        var time = markers[i].getAttribute("time");
        var timebgn = markers[0].getAttribute("time");
        var timeend = markers[markers.length-1].getAttribute("time");
        var type = markers[i].getAttribute("usid");
        var routesCng=[];
        var points=[];

        if (dateAdv != date){
            if (!routesCng) routesCng=[];
            routesCng = i;
            routeNum++;

            for (var k = 0; k < markers.length; k++) {  
                points.push(new google.maps.LatLng(
                parseFloat(markers[k].getAttribute("lat")),
                parseFloat(markers[k].getAttribute("lng"))));
            }
                        setPoints();
                        setPolyline();      
        }
        //alert([datePrv,time,dateAdv]); //**********************************
        var html1 = "<b>" + date + "</b> <br/>" + timebgn + "</b> <br/>" + "Start Point";
        var html2 = "<b>" + date + "</b> <br/>" + timeend + "</b> <br/>" + "End Point";
        var content2 = "<b>" + type + "</b> <br/>" + dateAdv + "</b> <br/>" + "User Route";
    }       
    function setPoints() {
        mPoints = points.splice([routesCng]);
            //alert([date,routesCng,dateAdv,routeNum]);

    }

    function setPolyline() {
        alert([date,routesCng,dateAdv,routeNum,mPoints]);
        var encoded_path = google.maps.geometry.encoding.encodePath(mPoints);
            console.log(encoded_path);
        var decoded_path = google.maps.geometry.encoding.decodePath(encoded_path);
        var polyOptions = {
                path: decoded_path,
                map: map,
                clickable: true,
                strokeColor: "#FF0000",
                strokeOpacity: 1.0,
                strokeWeight: 2
            }
        // Polyline
        var polyline = new google.maps.Polyline(polyOptions);

        //line text
        var info = decoded_path;
        polyline.setMap(map);

        createInfoWindow(polyline, map, infoWindow, content2);

        if(decoded_path.length!=0){  
            markerbgn = new google.maps.Marker({
                map: map,
                position: decoded_path[0],
                draggable: false,
                visible: true
            });
        markerend = new google.maps.Marker({
            map: map,
            position: decoded_path[decoded_path.length-1],
            draggable: false,
            visible: true
            });
        bindInfoWindow(markerbgn, map, infoWindow, html1);
        bindInfoWindow(markerend, map, infoWindow, html2);
        }
    }   
});
if (!points[date]) points[date] = [];
points[date].push(new google.maps.LatLng(
      parseFloat(markers[i].getAttribute("lat")),
      parseFloat(markers[i].getAttribute("lng"))));