javascript 如何从bounds值中提取左上和右下坐标

juud5qan  于 2022-12-25  发布在  Java
关注(0)|答案(3)|浏览(354)

我试图提取一个给定边界值的文本框的右上角和左下角的X和Y坐标。
示例:[84,672][1356,889]
JavaScript中是否有一个快速简单的函数可以将上述值提取到两个单独的变量中,以便我可以计算中心坐标?例如:

A = [84,672]
B = [1356,889]
q0qdq0h2

q0qdq0h21#

您可以使用RegEx:

const input = "[84,672][1356,889]";

// parse input
const nums = input.match(/\d+/g).map(Number);
const A = [nums[0], nums[1]];
const B = [nums[2], nums[3]];

console.log(A, B);

// calculate midpoint
const mdpt = [(A[0]+B[0])/2, (A[1]+B[1])/2];
console.log(mdpt);
plupiseo

plupiseo2#

没有一个简单快捷的函数可以做到这一点,但是你可以使用简单的字符串函数来创建你自己的函数:
在这里,我使用了substringindexOfreplacesplit
由于结果是一个数组,我使用map将原始字符串转换为数字,使用destructuring assignment获得结果。

const input = "[84,672][1356,889]";

function extractCoordinates(input) {
  // get a and b as strings using indexOf with offset
  const aStr = input.substring(0, input.indexOf('[', 1));
  const bStr = input.substring(input.indexOf('[', 1), input.length);
  // create a function that will remove the brackets and coerce to a number
  const mapToNumber = (s) => +s.replace(/\[|\]/g, '');
  // split the strings on the comma and run the function on the parts
  const a = aStr.split(',').map(mapToNumber);
  const b = bStr.split(',').map(mapToNumber);
  // And that's it
  return [a, b];
}

// Here I use array destructuring to get the results:
const [a, b] = extractCoordinates(input);
console.log(a, b);
xnifntxz

xnifntxz3#

另一种方法是将字符串转换为valid JSON string,以便:

"[84,672][1356,889]"

变成

"[[84,672],[1356,889]]"

你可以把][替换为], [,并把字符串封装到[]中,然后把这个字符串parse到一个JavaScript数组中,并使用索引把值提取到变量中:

const A = arr[0];
const B = arr[1];

或者,您可以使用destructuring assignment(如下所示)将嵌套数组提取到变量中

const str = "[84,672][1356,889]";
const [A, B] = JSON.parse(`[${str.replaceAll("][", "],[")}]`);

console.log(A);
console.log(B);

注意:如果您不支持replaceAll(),您可以使用全局正则表达式和.replace()方法:.replace(/]\[/g, '],[')

相关问题