2008-09-30 14 views
11

में सरणी के लिए निर्देशांक जावास्क्रिप्ट में किसी सरणी में किसी मंडली के निर्देशांक जोड़ने का सबसे अच्छा तरीका क्या है? अब तक मैं केवल आधा सर्कल करने में सक्षम हूं, लेकिन मुझे एक सूत्र की आवश्यकता है जो पूरे सर्कल को दो अलग-अलग सरणी में लौटाता है: xValues ​​और yValues। (मैं निर्देशांक पाने के लिए तो मैं एक मार्ग के किनारे एक वस्तु चेतन कर सकते हैं कोशिश कर रहा हूँ।)सर्कल को जावास्क्रिप्ट

यहाँ मैं अब तक है:

circle: function(radius, steps, centerX, centerY){ 
    var xValues = [centerX]; 
    var yValues = [centerY]; 
    for (var i = 1; i < steps; i++) { 
     xValues[i] = (centerX + radius * Math.cos(Math.PI * i/steps-Math.PI/2)); 
     yValues[i] = (centerY + radius * Math.sin(Math.PI * i/steps-Math.PI/2)); 
    } 
} 

उत्तर

21

आपका पाश इस बजाय की तरह स्थापित किया जाना चाहिए:

for (var i = 0; i < steps; i++) { 
    xValues[i] = (centerX + radius * Math.cos(2 * Math.PI * i/steps)); 
    yValues[i] = (centerY + radius * Math.sin(2 * Math.PI * i/steps)); 
} 
    शुरू
  • अपने लूप 0
  • पूरे 2 * पीआई रेंज के माध्यम से कदम, केवल पीआई नहीं।
  • आपके पास var xValues = [centerX]; var yValues = [centerY]; नहीं होना चाहिए - सर्कल का केंद्र इसका हिस्सा नहीं है।
+2

इसके अलावा, मैं पहले एक स्थानीय चर में चरण गणना को संग्रहीत करता हूं: 'var phase = 2 * Math.PI * i/steps;' –

1

आप पहले से ही आधे से एक चक्र है, तो बस अंक दर्पण अन्य आधा
प्राप्त करने के लिए सुनिश्चित करें कि आप सही क्रम में ऐसा करते हैं।

अधिक speficically, दूसरे आधे के लिए आप बस के साथ एक "- sin(...)"

1

आप क्योंकि और पाप में रेडियंस इनपुट करने के लिए एक आंशिक समारोह उपयोग करने की आवश्यकता "+ sin(...)" की जगह; इसलिए सर्कल के एक चौथाई या आधे भाग के लिए जो मूल्य मिल रहे हैं, उन्हें लें और उन्हें अपने पूर्ण सर्कल प्राप्त करने के लिए केंद्र बिंदुओं के धुरी पर प्रतिबिंबित करें।

ने कहा कि जावास्क्रिप्ट के पाप और कॉस काफी पसंद नहीं हैं, इसलिए आपने अपने रेडियन या कुछ को कम किया होगा; मैं इसे लिखने के रूप में चाहते हैं:

function circle(radius, steps, centerX, centerY){ 
    var xValues = [centerX]; 
    var yValues = [centerY]; 
    var table="<tr><th>Step</th><th>X</th><th>Y</th></tr>"; 
    var ctx = document.getElementById("canvas").getContext("2d"); 
    ctx.fillStyle = "red" 
    ctx.beginPath(); 
    for (var i = 0; i <= steps; i++) { 
     var radian = (2*Math.PI) * (i/steps); 
     xValues[i+1] = centerX + radius * Math.cos(radian); 
     yValues[i+1] = centerY + radius * Math.sin(radian); 
     if(0==i){ctx.moveTo(xValues[i+1],yValues[i+1]);}else{ctx.lineTo(xValues[i+1],yValues[i+1]);} 
     table += "<tr><td>" + i + "</td><td>" + xValues[i+1] + "</td><td>" + yValues[i+1] + "</td></tr>"; 
    } 
    ctx.fill(); 
    return table; 
} 
document.body.innerHTML="<canvas id=\"canvas\" width=\"300\" height=\"300\"></canvas><table id=\"table\"/>"; 
document.getElementById("table").innerHTML+=circle(150,15,150,150); 

मैं मान लिया है कि जो भी कारण के लिए आप XValues ​​[0] और yValues ​​[0] centerX और centerY बनना चाहता था। मैं यह नहीं समझ सकता कि आप इसे क्यों चाहते हैं, क्योंकि वे पहले से ही फ़ंक्शन में पास किए गए मान हैं।

0

मैं 2 से चरणों की संख्या से गुणा करके अपने दम पर इसे हल करने में सक्षम था:

circle: function(radius, steps, centerX, centerY){ 
    var xValues = [centerX]; 
    var yValues = [centerY]; 
    for (var i = 1; i < steps; i++) { 
     xValues[i] = (centerX + radius * Math.cos(Math.PI * i/steps*2-Math.PI/2)); 
     yValues[i] = (centerY + radius * Math.sin(Math.PI * i/steps*2-Math.PI/2)); 
    } 
} 
+1

ध्यान दें कि यह समाधान काम करता है, लेकिन आपने जो कहा है उससे भिन्न कारण के लिए। आपने कहा "2 से चरणों की संख्या गुणा करना" लेकिन आपकी अभिव्यक्ति का वास्तव में अर्थ है: ((Math.PI * i)/चरणों) * 2 सहयोगीता के कारण। –

7

ब्रेसनहेम का एल्गोरिदम रास्ता तेज है। आप सीधी रेखाओं को चित्रित करने के संबंध में इसके बारे में सुनते हैं, लेकिन मंडलियों के लिए एल्गोरिदम का एक रूप है।

चाहे आप इसका उपयोग करते हैं या ट्रिग गणनाओं के साथ जारी रखते हैं (जो इन दिनों तेजस्वी तेज हैं) - आपको केवल सर्कल के 1/8 वें स्थान को आकर्षित करने की आवश्यकता है। एक्स को स्वैप करके, y आप एक और 1/8 वां प्राप्त कर सकते हैं, और उसके बाद x का नकारात्मक, y, और दोनों - swapped और unswapped - आपको शेष सर्कल के लिए अंक देता है। 8x की गति!

5

बदलें:

Math.PI * i/steps 

रहे हैं:

2*Math.PI * i/steps 

एक चक्र पूरा 2pi रेडियंस है, और आप केवल अनुकरणीय रेडियंस जा रहे हैं।

संबंधित मुद्दे