2016-11-05 160 views
3

我正在谷歌地圖上進行實時跟蹤。我必須根據數據庫更新來更改標記。在變量中使用Foreach循環

這是一個testLocs變量。我想使它動態。

var testLocs = { 
    1: { info:'Demo', lat:31.933517, lng:74.910278 }, 
    2: { info:'Demo', lat:32.073266 , lng:76.997681 }, 
    3: { info:'Demo', lat:32.23139 , lng:78.425903 }, 
} 
setMarkers(testlocs); 

所以,對於從ajax調用每3000(3秒)我打電話ajax腳本。 所以,我以這種格式得到了ajax的響應。

在控制檯我Ajax響應得到了來自數據庫3個陣列,

Array-1 : ["Device-1", "Device-2", "Device-3"]; // all device name 
Array-2 : ["31.933517", "32.073266", "32.23139"]; // all latitude 
Array-3 : ["74.910278", "76.997681", "78.425903"]; // all longitude 

現在,我想在上面VAR testLocs使用它。

整體功能,

function myTimer(new_latitude, new_longitude,new_name) 
    { 
      var new_latitude = new_latitude; 
      var new_name = new_name; 
      var new_longitude = new_longitude; 

      console.log(new_name); 
      console.log(new_latitude); 
      console.log(new_longitude); 

      var testLocs = { 
       1: { info:'Demo', lat:31.933517, lng:74.910278 }, 
       2: { info:'Demo', lat:32.073266 , lng:76.997681 }, 
       3: { info:'Demo', lat:32.23139 , lng:78.425903 }, 
      } 
      setMarkers(testlocs); 
     } 
    var myVar = setInterval(function(){ myTimer() }, 3000); 

我試着用這個,但它不工作。

var testLocs = { 

     new_latitude.forEach(function(single_value) 
     { 
      single_value_latitude = single_value; 
      // alert(single_value_latitude); 
     }); 
} 

編輯:

Ajax代碼

(function worker() { 
    $.ajax({ 
     type: "POST", 
     dataType: "json", 
     // data: {business1: business1}, 
     url: '<?php echo site_url('home/automatic_fetch_data'); ?>', 
     success: function (data) { 
        //alert(data); 

       var new_lat = []; 
       var new_lng = []; 
       var new_name = []; 

       $.each(data, function(k, v) { 

        var lati = v['latitude']; 
        var lngi = v['longitude']; 
        var namei = v['name']; 
        new_lat.push(lati); 
        new_lng.push(lngi); 
        new_name.push(namei); 
       }); 
       var new_latitude = new_lat; 
       var new_longitude = new_lng; 
       var new_name = new_name; 
       // console.log(new_latitude); 
       // console.log(new_longitude); 
       myTimer(new_latitude, new_longitude,new_name); 
     },complete: function() { 
       // Schedule the next request when the current one's complete 
       setTimeout(worker, 3000); 
      } 
    }); 
})(); 

我得到下面陣列中Ajax響應後,console.log(data);

陣列:

陣列具有4個對象並且在每個目標i得到了所有的信息DEVICE_ID,DEVICE_NAME,緯度,經度。 在控制檯我有這個信息的數組。

[Object { id="1", device_id="1", device_name="Device-1", latitude="29.630771", longitude="74.910278"}, Object { id="2", device_id="2", device_name="Device-2", latitude="32.073266", longitude="76.997681"}, Object { id="3", device_id="5", device_name="Device-3", latitude="29.630771", longitude="74.910278"}, Object { id="5", device_id="3", device_name="Device-3", latitude="29.630771", longitude="74.910278"}] 
+0

什麼您從AJAX請求獲得的確切回覆?您當前的3個數組列表不是有效的語法。另外,你可以改變回應嗎?讓它以你期望的格式返回將比在黑暗中使用JS更容易 –

+0

@RoryMcCrossan。感謝您的答覆。我在數據庫的ajax響應中獲得了整個數組。但var testLocs格式不同,所以我認爲如果我使用lat,long等來劃分它,那麼它可能是可能的。我用整個數組更新我的問題。和ajax代碼。 – Bhavin

+0

@Bhavin收到的對象中沒有「name」屬性。因此,每個回調中的「var namei = v ['name']」是必須失敗的行。你可以仔細檢查價值或代碼? –

回答

3

轉換代碼(3個陣列爲對象與其他3個對象):

var new_name = ["Device-1", "Device-2", "Device-3"]; 
 
var new_latitude = ["31.933517", "32.073266", "32.23139"]; // all latitude 
 
var new_longitude = ["74.910278", "76.997681", "78.425903"]; 
 

 
var testLocs = new_name.reduce(function (res, curr, currentIndex) { 
 
    res[currentIndex + 1] = { 
 
    info: new_name[currentIndex], 
 
    lat: new_latitude[currentIndex], 
 
    lng: new_longitude[currentIndex] 
 
    }; 
 
    return res; 
 
}, {}); 
 

 
console.log(testLocs);

所以,你的函數可能看起來像:

function myTimer(new_latitude, new_longitude,new_name) { 
    console.log(new_name); 
    console.log(new_latitude); 
    console.log(new_longitude); 

    var testLocs = new_name.reduce(function (res, curr, currentIndex) { 
    res[currentIndex + 1] = { 
     info: new_name[currentIndex], 
     lat: new_latitude[currentIndex], 
     lng: new_longitude[currentIndex] 
    }; 
    return res; 
    }, {}); 

    setMarkers(testlocs); 
} 
+0

謝謝你的答覆。我得到這個錯誤:無法讀取屬性'減少'未定義(...)。 – Bhavin

+0

這是完美的工作非常感謝你這個解決方案。我仍然有這個錯誤無法讀取屬性'減少'未定義(...)。 – Bhavin

+1

new_name應該是你的名字數組([「Device-1」,「Device-2」,「Device-3」]),你是否在console.log(new_name)打印時看到它?如果沒有,那麼你可能沒有在你的功能中收到它 – Andriy