2015-09-28 18 views
1

所以我有例如該陣列的條形圖的索引:明白了我需要匹配與另一陣列

[12, 32, 42, 32, 43, 0, 0, 0, 5, 0, 0, 0] 

所以我有從標記這個陣列從一個谷歌地圖的6的長度,所以從索引0到5.

我在條形圖上有一個高亮事件,當它被觸發時,它給了我指向索引。我使用pointindex從google maps數組中獲取標記,例如:「gmap.markers [pointindex]」。這適用於條形圖數組中的前5個值。但條形圖數組的第九個值有pointindex 8,但我的google maps數組只有0到5作爲索引。所以它不再工作了。基本上,pointindex 8基本上來自google地圖標記數組的索引5。

這個問題也會以這些值爲例。

條形圖陣列:[12, 32, 42, 32, 43, 0, 7, 0, 5, 0, 0, 0]

谷歌地圖標記陣列7的長度,因此索引爲0〜6

我對圖中的棒,此事件的亮點這個代碼被髮射以及我做的東西與標記突出顯示的標記(基本不變的圖標。

chart.bind('jqplotDataHighlight', 
    function (ev, seriesIndex, pointIndex, data) { 
     marker = gmap.markers[pointIndex]; 
     if (marker !== null && marker !== undefined) { 
      marker.setIcon('https://maps.gstatic.com/mapfiles/ms2/micons/blue-dot.png'); 
     } 
    } 
); 

正如我解釋當在柱狀圖陣列的pointindex空數據,在杆的指數沒有按」不再與谷歌的索引匹配標記。

我想我的腦海中複製條形圖數組到一個新的數組,並刪除所有包含「0」的值。並比較條形圖數組的值與不帶「0」值的新數組,以查看新數組中的索引。這樣它會再次與Google地圖標記索引匹配。但是,然後你有問題,如果條形圖數組有2個值是相同的,那麼這種方法不再工作。

有沒有人知道這個問題的解決方案,在我的腦海裏,問題很簡單,但我無法在代碼中弄清楚。

+0

爲什麼你有'& &'?複製粘貼錯誤? –

+0

因爲Javascript是在一個JSF頁面中,所以JSF需要它來正確解析它,我會將它改爲&& ;) –

+0

那麼圖表中的條如何映射到標記?你的應用正在做什麼?如果沒有用於映射的酒吧的標記,那麼以這種方式映射酒吧有什麼意義? – Alex

回答

1

感謝@Alex的想法,並感謝@NinaScholz的幫助,但我想你誤解了我的問題,我知道這是一個模糊的問題,對不起。

我已經解決了這個問題。

當頁面加載我這樣做:

var barArray = PF('dataChart').plot.data[0]; 
var mappingArray = new Array(barArray.length); 
var j = 0; 
for (var i = 0; i < barArray.length; i++) { 
    if (barArray[i] !== 0) { 
     mappingArray[i] = j; 
     j++; 
    } else { 
     mappingArray[i] = null; 
    } 
} 

而且現在的聽衆做到這一點:

chart.bind('jqplotDataHighlight', 
    function (ev, seriesIndex, pointIndex, data) { 
     marker = gmap.markers[mappingArray[pointIndex]]; 
     if (marker !== null && marker !== undefined) { 
      marker.setIcon('https://maps.gstatic.com/mapfiles/ms2/micons/blue-dot.png'); 
     } 
    } 
); 

所以基本上我做一個新的數組,它是隻要圖表陣列,如果圖表數組中的值的值不是0,我將mappingArray中此索引的值設置爲與Google標記索引匹配的已計數索引。如果這可以做得更好,請告訴!

+2

沒錯,就是它 - 良好的合作! :) – Alex

1

這裏是保留索引和正確索引以實現稀疏訪問的解決方案。

var barChart = [12, 32, 42, 32, 43, 0, 7, 0, 5, 0, 0, 0], 
 
    filtered = []; 
 

 
barChart.forEach(function (a, i) { 
 
    a && filtered.push({ value: a, index: i }); 
 
}); 
 
document.write('<pre>' + JSON.stringify(filtered, 0, 4) + '</pre>');

+0

這隻會從條形圖數組中刪除0值,這些值不是假值。這些點沒有測量數據。 結算此圖像:http://i.imgur.com/eWCrdYU.png圖表上的1到12是幾個月。只有6個月有測量數據,所以只有那些有經度和緯度的。所以只有6個標記。 –

+0

@NinaScholz,使用:'document.body.innerHTML ='

' + JSON.stringify(barChart, null, ' ') + '
';' –

+0

@ Mr.Polywhirl,會改變什麼? –

1

所以@龔如心的解決方案的工作原理,但不是在用戶界面交互方面。

基本上你需要看看被點擊的欄是否有一個值,如果是,它會在Nina的過濾解決方案中映射到哪個索引。一旦獲得了來自已過濾數組的值的索引,就可以將其映射到您的標記數組。

要做到這一點:

我認爲最好的辦法是,建立柱狀圖維持與一個對象,它是像{ filteredIndex: N }數組時。此數組的長度與條形圖的長度相同,並告訴您在已過濾數組中哪個索引映射到該數組。如果數據爲0,則filteredIndex將爲空。

您可以簡單地通過迭代您的數據並將值推送到過濾數組(如果值大於0並將索引保​​存在單獨的映射數組中)來完成此操作。

+0

的確,我想到了這一點。但是接下來會出現這樣的問題,例如當你在數組中有相同的值時,例如2 10。那麼你如何正確地映射它。 –

+0

另外,如果圖表某一點沒有數據,則沒有位置。 –

+0

與妮娜的解決方案,我可以過濾掉0值。然後使用pointindex從原始圖表數組中獲取數據,然後使用過濾數組中的該值進行搜索,並從已過濾數組中獲取索引,該索引將與標記匹配。但問題是,當數組中有兩個相同的值時,這不再適用? –

相關問題