जावास्क्रिप्ट: स्वचालित रूप से एक परिवर्तनीय बहु-आयामी सरणी को क्रमशः

Question

ऑर्डर करें यह गणित से संबंधित प्रश्न की तरह है।

मैं jQuery के साथ एक प्यारा लुप्तप्राय प्रभाव बनाने की कोशिश कर रहा हूं, ब्लॉक की एक निश्चित संख्या में तत्व को विभाजित करके, फिर उनमें से प्रत्येक को लुप्त कर रहा हूं, लेकिन किसी अन्य सरणी के आधार पर लुप्तप्राय प्रभाव में देरी कर रहा हूं।

तो ब्लॉक तालिका बनाने के लिए मैं दो चर है:

   0 1 2 3 4 5 6 7 8 9 
      10 11 12 13 14 15 16 17 18 19 
      20 21 22 23 24 25 26 27 28 29 
      30 31 32 33 34 35 36 37 38 39 

तो मैं एक और सरणी जो कैसे ब्लॉक का फैसला करता है बना रहा हूं:

var rows = 4, 
    cols = 10; 

इस तरह ब्लॉक में तत्व को विभाजित करेगा एनिमेट करेगा

order = [0, 10, 1, 20, 11, 2, 30, 21, 12, 3, 31, 22, 13, 4, 32, 23, 14, 5, 33, 24, 15, 6, 34, 25, 16, 7, 35, 26, 17, 8, 36, 27, 18, 9, 37, 28, 19, 38, 29, 39]; 

और इस विशेष मामले के लिए यह काम करता है: उदाहरण के लिए, एक बाएँ-से-दाएँ विकर्ण एनीमेशन के लिए इस सरणी कैसा लगेगा डी

मेरा प्रश्न कैसे मैं order सरणी स्वचालित रूप से बना सकते हैं है, मैन्युअल रूप से नहीं, ब्लॉक की संख्या (पंक्तियों x कॉलम) के आधार पर, जो बदल सकता है?

धन्यवाद

Answer 1

यह यह करना होगा:

var arr = []; 

var rows = 4; 
var cols = 10; 

for(var i = 0; i < rows + cols - 1; i++){ 

    for(var j = Math.min(rows, i + 1) - 1; j >= Math.max(0, i - cols + 1); j--){ 
     arr.push((j * cols) + i - j); 
    } 

} 

बेला: http://jsfiddle.net/BmXpy/

संपादित करें: यहाँ बताया गया हो कि मैं इस के साथ आया था पर मेरे प्रयास है। महत्वपूर्ण, विज़ुअलाइज़ करने के लिए ऊपर की संख्याओं की तालिका का उपयोग करें और यदि आवश्यक हो, तो इसे प्रिंट करें और विकर्ण निकालें।

सबसे पहले, हम जो चाहते हैं उसके बारे में सोचें, यह मूल रूप से विकर्ण है। पहले विकर्ण के ऊपर उदाहरण में 0, फिर 10, 1, फिर 20, 11, 2, फिर 30, 21, 12, 3 इत्यादि हैं। अब यदि आप सोचते हैं कि उनमें से कितने विकर्ण हैं, तो यह rows + cols - 1 है।

for(var i = 0; i < rows + cols - 1; i++){ 

अब, एक दूसरे boundries के लिए उपेक्षा: यह जहां हम पहले पाश प्राप्त है। सामान्य मामले (पूरे केंद्र) में, इनमें से प्रत्येक विकर्ण "पंक्तियां" लंबी होती है। और चूंकि हम नीचे जाना चाहते हैं, हम एक रिवर्स लूप चाहते हैं। यही कारण है कि भीतरी पाश के लिए इस प्रकार दिखाई देगा:

for(var j = rows - 1; j >= 0; j--){ 

अब, हम दोनों boundries (बाएँ और दाएँ) के साथ सौदा करना चाहिए।

बाएं सीमा के लिए, यदि हम लंबे समय से "पंक्तियों" से कम विकर्णों की संख्या देखते हैं, तो हम देखेंगे कि यह rows - 1 है। और इन विकर्णों के लिए हम देखेंगे कि प्रत्येक की लंबाई i + 1 है।

for(var j = Math.min(rows, i + 1) - 1; j >= 0; j--){ 

आप विकर्ण 0 के लिए है कि देखेंगे, यह, एक बार चलेगा 1 के लिए इसे दो बार, आदि चलेंगे और सामान्य स्थिति के लिए (i >= rows: निम्नलिखित भीतरी पाश सामान्य मामले और छोड़ दिया सीमा संभाल लेंगे) यह "पंक्तियों" के समय चलाएगा।

अब, सही सीमा। यदि हम देखते हैं कि दाईं ओर कौन से विकर्ण "पंक्तियों" से छोटे हैं, तो हम देखेंगे कि यह "कोल्स" से अधिक सभी विकर्ण हैं (उदाहरण में जहां कोल्स 10, 0 अनुक्रमित है, जो पंक्ति 10 और उससे आगे है)। j >= Math.max(0, i - cols + 1) के साथ सामान्य मामले और बाएं सीमा के लिए 0 पर चला जाएगा लेकिन दाएं सीमा के लिए छोटा होगा। हमें यह मिलता है:

for(var j = Math.min(rows, i + 1) - 1; j >= Math.max(0, i - cols + 1); j--){ 

और अंत में, प्रत्येक स्थान में संख्या की वास्तविक गणना। i विकर्ण का प्रतिनिधित्व करता है और j विकर्ण j = 0 पर संख्या की सूचकांक का प्रतिनिधित्व करता है यदि आप संख्याओं की पोस्ट तालिका देख रहे हैं तो शीर्ष संख्या है। j = 0 (संख्या की शीर्ष पंक्ति) संख्या केवल i, शीर्ष नीचे प्रत्येक पंक्ति के लिए है के लिए, हम पहली पंक्ति संख्या के नीचे सीधे नंबर प्राप्त करने के लिए "कॉलम" द्वारा संख्या गुणा करने की आवश्यकता है, तो संख्या होना चाहिए बाईं ओर समायोजित। यह j घटाकर किया जाता है जो पंक्ति संख्या है। तो j = 1 (दूसरी पंक्ति) के लिए हमें एक नंबर को छोड़कर संख्या को स्थानांतरित करने की आवश्यकता है (1 घटाएं)। इसलिए हम पहली पंक्ति पर क्षैतिज स्थिति के लिए i, + (j * cols) उचित पंक्ति करने के लिए इसे नीचे ले जाने के लिए है और फिर -j विकर्ण करने के लिए इसे समायोजित करने के लिए (यदि आप विकर्ण तैयार की है, इस उनमें से एक एक अच्छा पाने के लिए बाहर का पता लगाने दृश्य)। हमें यह मिलता है:

(j * cols) + i - j 

इसे सभी एक साथ रखें और आपको मेरा अंतिम कोड ऊपर मिल जाएगा। उम्मीद है कि कुछ समझ में आया।

Answer 2

यहाँ एक और कोड http://jsfiddle.net/paska/FhLnu/3/

var rows = 4, 
    cols = 10, 
    getValue = function(x, y) { 
     return (y * cols) + x; 
    }, 
    addValue = function(x, y) { 
     $("#arr").append(getValue(x, y) + ", "); 
    }, 
    max = rows + cols - 1, 
    updateRow = 0; 

for(var i = 0; i < max; i++) { 
    if(i >= rows) 
     updateRow++; 
    for(var x = 0; x <= i; x++) { 
     //$("#arr").append(x + " " + (i - x) + "<br />"); 
     var row = (i - x), 
      col = x; 
     if(updateRow) { 
      row = row - updateRow; 
      col = col + updateRow; 
     } 
     if(col >= cols) 
      break; 
     if(row >= 0 && col >= 0) 
      addValue(col, row); 
    } 
} 

मैं @kingjiv कोड काम करता है है, मैं सिर्फ यह कर का एक और तरीका जोड़ना चाहते थे।

Answer 3

फिर भी एक और तरीका यह करने के लिए।

function diagonalized_block (rows, cols) { 
    blocks = []; 
    for (var i = 0; i < rows * cols; i++) { 
     blocks.push(i); 
    } 
    blocks.sort(function (a, b) {return a/cols + a%cols - b/cols - b%cols}); 
    return blocks; 
} 

विचार सरल है। सभी ब्लॉक की स्पष्ट सरणी लिखें, और तब उस ब्लॉक के फ़ंक्शन द्वारा क्रमबद्ध करें जो बिल्कुल इच्छित क्रम में आरोही है। वह कार्य x/cols + x%cols है। row + ascending error on diagonal + col कौन सा है। तो आप चीजों को पहले क्रमबद्ध करते हैं जिसके द्वारा वे विकर्ण हैं, और फिर विकर्ण पर चढ़ते हैं।

अन्य पैटर्न आप अन्य कार्यों है कि सही ढंग से सुलझाने के लिए हो ढूंढना होगा के लिए

। (या एक और अधिक जटिल प्रकार समारोह है कि वास्तव में क्या आप इसे क्या करना चाहते हैं लिखें।)