Bảng phức tạp kết hợp thuật toán javascript & jquery

Question

Tôi gặp vấn đề khá độc đáo nên tôi đang gặp sự cố khi giải quyết. Tôi có một bảng 2 x 3, sắp xếp như hình dưới đây.

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

Dữ liệu được điền vào các ô của bảng. Đôi khi, dữ liệu trong một cột hoặc hàng có thể giống nhau. Ví dụ, nếu (1,1) và (1,2) có cùng dữ liệu. Trong một số trường hợp (1,1), (1,2) và (1,3) tất cả đều có cùng dữ liệu. Nếu các giá trị trong các ô giống nhau và liền kề, chúng cần được hợp nhất. Ví dụ: nếu (1,1) và (1,2) cả hai đều có giá trị là "100" thì hai ô sẽ được hợp nhất. Tôi đã làm điều này bằng tay bằng cách sử dụng jquery như:

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

tôi ẩn (1,2) tế bào thay vì xóa, kể từ khi bảng có thể được thiết lập lại đến 2x3 ban đầu và sau đó repopulated nếu cần thiết. Theo cách thủ công, công trình này tuyệt vời, nhưng tôi cần một phương pháp năng động. Dưới đây là mục tiêu tổng thể của những gì cần phải được hoàn thành.

• Nếu hai ô liền kề theo chiều dọc hoặc ba ô liền kề theo chiều dọc trong cột tương ứng có giá trị bằng nhau thì các ô đó được hợp nhất với nhau.
• Các ô hàng, như (1,1) và (2,1) có thể có dữ liệu trùng lặp và không bao giờ được hợp nhất.
• Để tham khảo, các nhóm ô tương thích được hợp nhất là {(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)}
• Nhiều lần hợp nhất có thể xảy ra cùng một lúc. Ví dụ: {(1,1), (1,2)} có cùng dữ liệu và {(2,1), (2,2), (2,3)} có cùng dữ liệu. Cả hai nhóm được hợp nhất riêng lẻ.

Câu hỏi chính của tôi là, làm cách nào để viết một thuật toán để thực hiện việc này, mà không cần phải viết ra mọi tình huống có thể xảy ra. Ai đó có thể cho tôi xem một ví dụ về thứ gì đó có thể hoạt động không? Tôi nhận ra điều này phức tạp, vì vậy hãy đặt câu hỏi để làm rõ. Cảm ơn rất nhiều về nâng cao. Đây là một trợ giúp rất lớn!

Answer 1

Như thế này? http://jsfiddle.net/4zGvg/ Làm việc với các hàng/cột tùy ý.

Ý tưởng: chúng tôi có ma trận values và ma trận span. Các giá trị của span là

0 = ẩn tế bào này

1 = tế bào bình thường

x> 1 = di động với rowspan x

Lặp bởi cột trong mệnh lệnh trực tiếp và hàng theo thứ tự ngược . Nếu giá trị của một số tế bào là bằng giá trị dưới nó, tăng của span tế bào này và xóa các span của tế bào dưới đây:

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; 
     } 
    } 
} 

Một khi điều này được thực hiện, bạn có thể sử dụng span để tạo ra các bảng đầy đủ hoặc để hiển thị/ẩn các ô và đặt các thuộc tính rowspan của chúng.

Answer 2

Vì nó luôn luôn 2x3, bạn chỉ có thể bruteforce nó.

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); 
} 

này chắc chắn có thể được tối ưu hóa, đây chỉ là nhanh chóng và dơ bẩn. Bạn chắc chắn sẽ muốn lưu tài liệu tham khảo cho các tế bào và không gọi eq rất nhiều lần. Bạn sẽ phải làm tương tự cho cột thứ 2.

Nếu bảng có thể thay đổi kích cỡ, bạn sẽ muốn lặp qua từng ô trong cột và cho mọi phạm vi phù hợp, ẩn các kết quả phù hợp và đặt hàng. Tương đối dễ dàng, nhưng không thực sự cần thiết ở đây.