2012-02-07 47 views
5

我有一個相當獨特的問題,我遇到了問題解決。我有一張2 x 3的桌子,排列如下。複雜的表格合併javascript&jquery算法

        _ __ _ _ __
1- | _ __ _ | __ _ _ |
2- | _ __ _ | __ _ _ |
3- | _ __ _ | __ _ _ |

數據被填充到表格的單元格中。有時,列或行中的數據可能相同。例如,如果(1,1)和(1,2)具有相同的數據。在某些情況下(1,1),(1,2)和(1,3)都可以具有相同的數據。如果單元格中的值相同且相鄰,則需要合併它們。例如,如果(1,1)和(1,2)的值均爲「100」,則這兩個單元格會合並。我手動使用jQuery像這樣做:

(1,2).hide(); 
(1,1).attr("rowspan", "2"); 

我隱藏了(1,2)電池,而不是刪除,因爲該表可以恢復到初始的2×3,然後根據需要重新填充。手動,這很好,但我需要一個動態的方法。以下是需要完成的總體目標。

  • 如果兩個垂直相鄰的單元格或三個垂直相鄰的單元格在它們各自的列中具有相同的值,則這些單元格會合並在一起。
  • 行單元格(如(1,1)和(2,1))可以有重複的數據,並且永遠不會合並。
  • 作爲參考,兼容合併的單元組爲{(1,1),(1,2)},{(1,1),(1,2),(1,3)} ,{(1,2),(1,3)},{(2,1),(2,2)},{(2,1),(2,2),(2,3)},{ (2,2),(2,3)}
  • 多次合併可能一次發生。例如:{(1,1),(1,2)}具有相同的數據,並且{(2,1),(2,2),(2,3)}具有相同的數據。兩組都單獨合併。

我的主要問題是,我會怎麼寫一個算法來做到這一點,而不寫出每一個可能的情況。有人能告訴我一個可行的例子嗎?我意識到這很複雜,所以請隨時提出澄清問題。先進的非常感謝。這是一個巨大的幫助!

+0

表格總是2x3嗎? – 2012-02-07 18:21:49

+0

聽起來像一份工作......卡諾圖。請參閱http://en.wikipedia.org/wiki/Karnaugh_map – 2012-02-07 18:24:27

+0

該表始終爲2 x 3.單元格的合併可能會導致表格變爲2 x 2或2 x 1. – dremme 2012-02-07 18:25:51

回答

3

是否這樣? http://jsfiddle.net/4zGvg/ 適用於任意行/列。

想法:我們有values矩陣和span矩陣。的span值是

0 =隱藏此細胞

1 =正常細胞

X> 1 =與rowspan的小區x

迭代通過在直接順序列和通過以相反的順序排。如果某些單元格的值等於低於它的價值,增加該小區的span並刪除下面的單元格的span

for (var col = 0; col < cols; col++) { 
    for (var row = rows - 2; row >= 0; row--) { 
     if (values[row][col] == values[row + 1][col]) { 
      span[row][col] = span[row + 1][col] + 1; 
      span[row + 1][col] = 0; 
     } 
    } 
} 

一旦做到這一點,你可以用span生成完整的表或顯示/隱藏單元格並設置它們的rowspan屬性。

+0

非常酷。最佳答案我找到了。我會盡力實施這個解決方案。謝謝。 – dremme 2012-02-07 20:40:25

2

因爲它總是2x3,所以你可以蠻力。

http://jsfiddle.net/Csxbf/

var $cells = $("td"); 

if ($cells.eq(0).text() == $cells.eq(2).text()) { 

    if ($cells.eq(2).text() == $cells.eq(4).text()) { 
     $cells.eq(2).hide(); 
     $cells.eq(4).hide(); 
     $cells.eq(0).attr("rowspan",3); 
    } else { 
     $cells.eq(2).hide(); 
     $cells.eq(0).attr("rowspan",2); 
    } 

} else if ($cells.eq(2).text() == $cells.eq(4).text()) { 
    $cells.eq(4).hide(); 
    $cells.eq(2).attr("rowspan",2); 
} 

這肯定可以得到優化,這只是快速和骯髒。你一定會想保存對單元格的引用,而不是多次調用eq。你必須爲第二欄做同樣的事情。

如果表格可以更改大小,則您需要循環遍歷列中的每個單元格以及每個匹配的範圍,隱藏匹配並設置rowspan。相對容易,但在這裏並不是真的需要。

+0

我實際上有一個bruteforced版本可以正常工作。我希望能夠優化它。 – dremme 2012-02-07 18:36:00

+0

對於一個小型的靜態表來說,就性能而言,bruteforce將會是最佳的。更動態的東西只會增加開銷。 – 2012-02-07 18:39:49

+0

我明白了。我很滿意我已經寫過的暴力代碼。我發佈這個的原因只是我對額外解決方案的好奇心。感謝您的答覆。 – dremme 2012-02-07 18:49:33