1

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

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

问题是我需要创建一条折线：

--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不是解决它的好方法..）

4

0 回答 0