Question

所以我有一个正在开发的网站和一个REST服务器背后的演示文稿，我正在检查网站上的一些设备并通过服务器上的GET发送名称。服务器从mySQL中找到一些地理定位数据DB并将它们作为对GET的响应返回到站点。

我想为每个不同的设备动态绘制折线，并为每个设备添加从DB返回的任意数量的位置。

问题在于我需要创建折线：

- 标记的markers数组（我从数据库获取的每个位置都有一个标记）

- 以及位置在地图上的位置的latlngs数组

每个设备

！

我检查的设备数量或我收到的每个设备的位置都不是静态的。我尝试使用eval("var " + DeviceID + "_Markers = [];");创建新数组，但它似乎不起作用...

我现在所做的就是：从数据库中获取结果，该字符串在不同设备之间$$，设备的不同位置之间||和每个位置字段之间#！以下是获取和“解码”字符串的代码：

var devArray = respData.split("$$");

for (i=0 ; i < devArray.length ; i++)
{
    var posArray = devArray[i].split("||");
    for (j=posArray.length-1 ; j >= 0 ; j--)
    {
        var data = posArray[j].split("#");
        var DeviceID = data[0];
        var Date = data[1];
        var Latitude = data[2];
        var Longitude = data[3];
        var Altitude = data[4];
        var Angle = data[5];
        var Speed = data[6];
        parent.ifr2.createLocationMarker(DeviceID,Date,Latitude,Longitude,Altitude,Angle,Speed);
    }
}

createLocationMarker()调用google maps api的htmp页面上的特定方法，因为它表示为每个读取的位置创建一个新的位置标记。

    function createLocationMarker(DeviceID,Date,Latitude,Longitude,Altitude,Angle,Speed) {

    var newLocation =  new google.maps.LatLng(Latitude,Longitude);
    var locationMarker = new google.maps.Marker();

    locationMarker.setOptions({
      icon: locationIcon,
      shadow: newShadow,
      draggable: true,
      map: map,
      position: newLocation
    });

    if ((eval("typeof " + DeviceID + "_latlngs") === "undefined") {
        // latlngs Array
        eval("var " + DeviceID + "_latlngs = new google.maps.MVCArray();");

        // markers Array
        eval("var " + DeviceID + "_Markers = [];");

        // displayPath
        eval("var " + DeviceID + "_displayPath = new google.maps.Polyline({ map: map, strokeColor: '#" + Math.floor(Math.random()*16777215).toString(16) + "' ,strokeOpacity: 1.0, strokeWeight: 2, path: latlngs });");
    }

    eval(DeviceID + "_Markers.push(locationMarker);");
    eval(DeviceID + "_latlngs.push(newLocation);");
    eval(DeviceID + "_displayPath.setPath(" + DeviceID + "_latlngs);");

    locationMarker.setMap(map);

    var content = "<b>Device ID: </b>" + DeviceID + "</br><b>Date: </b>" + Date + "</br><b>Latitude: </b>" + Latitude + "</br><b>Longitude: </b>" + Longitude + "</br><b>Altitude: </b>" + Altitude + "</br><b>Angle: </b>" + Angle + "</br><b>Speed: </b>" + Speed + "Km/h";

    var infowindow = new google.maps.InfoWindow({
        content: content,
        disableAutoPan: true
    });

    google.maps.event.addListener(locationMarker, "dblclick", function() {
        infowindow.open(map,locationMarker);
    });

    map.setCenter(newLocation);
}

这似乎在每个点都创建了eval的新数组，即使它们应该在第一次创建后存在... 我确信必须有更好的方法来实现这个，但我现在找不到任何东西.. 关于如何为每个不同的设备动态创建折线并在其中添加位置的任何想法？（或者让这项工作成功的方法，即使我知道eval不是解决问题的好方法..）

Google Maps API动态多折线创建

0 个答案: