ক্যানভাসে দুটি পয়েন্টের মধ্যে দূরত্ব পান


105

আমার ক্যানভাস অঙ্কন ট্যাব রয়েছে এবং লাইনউইথটি দুটি শেষ মাউসমোভ স্থানাঙ্ক আপডেটের মধ্যে দূরত্বের ভিত্তিতে থাকতে চাই। আমি নিজের প্রস্থের দূরত্বের অনুবাদ করব, কেবলমাত্র সেই পয়েন্টগুলির মধ্যে কীভাবে দূরত্ব আনতে হবে তা জানতে হবে (আমার কাছে ইতিমধ্যে এই পয়েন্টগুলির স্থানাঙ্ক রয়েছে)।

উত্তর:


214

আপনি পাইথাগোরাস উপপাদ্য দিয়ে এটি করতে পারেন

আপনার যদি দুটি পয়েন্ট (x1, y1) এবং (x2, y2) থাকে তবে আপনি x এর পার্থক্য এবং y এর পার্থক্য গণনা করতে পারবেন, তাদেরকে a এবং b কল করতে দিন।

এখানে চিত্র বর্ণনা লিখুন

var a = x1 - x2;
var b = y1 - y2;

var c = Math.sqrt( a*a + b*b );

// c is the distance

11
আপনি সংক্ষিপ্ত করতে পারবেন var c = Math.sqrt (a a + b b); to var c = Math.hypot (a, b);
evgpisarchik

4
a ^ 2 + b ^ 2 = c ^ 2 হাইপোটেনাস সমীকরণ
কাদ

তুমি গেলে x1 - x2, y1 - y2নাকি কোন পার্থক্য আছে x2 - x1, y2 - y1?
রমজান চ্যাসিগভ

4
@ রমজানচ্যাসিগোভ এই ক্ষেত্রে কোনও পার্থক্য নেই কারণ প্রতিটি মান বর্গাকার! তাই যাতে মত ছিল কিনা 7 - 5 = 2বা 5 - 7 = -2আসে যায় না। -2 * -2 = 4 2 * 2 = 4
rdmurphy

168

নোট যে Math.hypotES2015 মান অংশ। এই বৈশিষ্ট্যটির জন্য MDN ডকটিতে একটি ভাল পলিফিলও রয়েছে ।

তাই দূরত্ব পাওয়া যত সহজ হয় Math.hypot(x2-x1, y2-y1)


27

http://en.wikedia.org/wiki/Euclidean_distance

আপনার যদি স্থানাঙ্ক থাকে তবে দূরত্ব গণনা করতে সূত্রটি ব্যবহার করুন:

var dist = Math.sqrt( Math.pow((x1-x2), 2) + Math.pow((y1-y2), 2) );

যদি আপনার প্ল্যাটফর্ম অপারেটরটিকে সমর্থন করে তবে** আপনি পরিবর্তে এটি ব্যবহার করতে পারেন:

const dist = Math.sqrt((x1 - x2) ** 2 + (y1 - y2) ** 2);

1

দুইটি স্থানাঙ্কের মধ্যে x এবং y এর দূরত্ব! x1 এবং y1 হ'ল প্রথম বিন্দু / অবস্থান, x2 এবং y2 দ্বিতীয় পয়েন্ট / অবস্থান!

function diff (num1, num2) {
  if (num1 > num2) {
    return (num1 - num2);
  } else {
    return (num2 - num1);
  }
};

function dist (x1, y1, x2, y2) {
  var deltaX = diff(x1, x2);
  var deltaY = diff(y1, y2);
  var dist = Math.sqrt(Math.pow(deltaX, 2) + Math.pow(deltaY, 2));
  return (dist);
};


এর Math.absপরিবর্তে আপনার ব্যবহার করা উচিত diff
মোশে সিমন্তভ

4
diffকোনও সংখ্যা স্কোয়ারিং হিসাবে আপনাকে ব্যবহার করার দরকার নেই কারণ সর্বদা ইতিবাচক সংখ্যার ফলাফল হয়। যদি x1 - y1নেতিবাচক (x1 - y1) ^ 2হয় তবে এখনও ইতিবাচক।
রেডউল্ফ প্রোগ্রাম

0

আমি আমার তৈরি জিনিসগুলিতে এই গণনাটি অনেক বেশি ব্যবহার করার প্রবণতা রাখি, তাই আমি এটি ম্যাথ অবজেক্টে যুক্ত করতে চাই:

Math.dist=function(x1,y1,x2,y2){ 
  if(!x2) x2=0; 
  if(!y2) y2=0;
  return Math.sqrt((x2-x1)*(x2-x1)+(y2-y1)*(y2-y1)); 
}
Math.dist(0,0, 3,4); //the output will be 5
Math.dist(1,1, 4,5); //the output will be 5
Math.dist(3,4); //the output will be 5

হালনাগাদ:

এই পদ্ধতির বিশেষত খুশি হওয়া যখন আপনি কিছু পরিস্থিতিতে সমাপ্ত হন (আমি প্রায়শই করি):

varName.dist=Math.sqrt( ( (varName.paramX-varX)/2-cx )*( (varName.paramX-varX)/2-cx ) + ( (varName.paramY-varY)/2-cy )*( (varName.paramY-varY)/2-cy ) );

এই ভয়াবহ জিনিসটি অনেক বেশি পরিচালিত হয়ে ওঠে:

varName.dist=Math.dist((varName.paramX-varX)/2, (varName.paramY-varY)/2, cx, cy);
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.