如何將坐標陣列中的每個值相乘-有解無憂

我有一個坐標陣列：

const markerCoords = [
{ topLeftX: 68.5, topLeftY: 19 },
{ topLeftX: 57.5, topLeftY: 57.5 },
{ topLeftX: 140.5, topLeftY: 52 },
{ topLeftX: 136, topLeftY: 70 },
{ topLeftX: 134.3, topLeftY: 88.3 },
{ topLeftX: 270.5, topLeftY: 68.8 },
{ topLeftX: 211.7, topLeftY: 135.3 },
{ topLeftX: 245.5, topLeftY: 189.7 },
{ topLeftX: 199.5, topLeftY: 222.5 },
{ topLeftX: 128.5, topLeftY: 241.6 },
{ topLeftX: 174.3, topLeftY: 263.5 },
{ topLeftX: 167.8, topLeftY: 285.7 },
{ topLeftX: 134, topLeftY: 309 },
{ topLeftX: 251, topLeftY: 304.6 }];

我想將每個值乘以 x，并將新坐標映射到一個新的類似陣列。像這樣：

const newMarkerCoords = markerCoords.map({topLeftX, topLeftY} => {topLeftX * x, topLeftY * x})

當我將影像地圖放大時，將標記放置在正確的位置上。

uj5u.com熱心網友回復：

您非常接近，這是您嘗試做的作業示例：

const markerCoords = [
{ topLeftX: 68.5, topLeftY: 19 },
{ topLeftX: 57.5, topLeftY: 57.5 },
{ topLeftX: 140.5, topLeftY: 52 },
{ topLeftX: 136, topLeftY: 70 },
{ topLeftX: 134.3, topLeftY: 88.3 },
{ topLeftX: 270.5, topLeftY: 68.8 },
{ topLeftX: 211.7, topLeftY: 135.3 },
{ topLeftX: 245.5, topLeftY: 189.7 },
{ topLeftX: 199.5, topLeftY: 222.5 },
{ topLeftX: 128.5, topLeftY: 241.6 },
{ topLeftX: 174.3, topLeftY: 263.5 },
{ topLeftX: 167.8, topLeftY: 285.7 },
{ topLeftX: 134, topLeftY: 309 },
{ topLeftX: 251, topLeftY: 304.6 }];

const x = 2;
    
newMarkerCoords = markerCoords.map(({topLeftY, topLeftX}) => {return {topLeftY: topLeftY * x, topLeftX: topLeftX * x}})

console.log(newMarkerCoords);

uj5u.com熱心網友回復：

這可能是你想要的：

const newMarkerCoords = markerCoords.map(item => {return {topLeftX:item.topLeftX*x, topLeftY:item.topLeftY*x};})

uj5u.com熱心網友回復：

我認為這是您的代碼的問題：

const markerCoords = [
{ topLeftX: 68.5, topLeftY: 19 },
{ topLeftX: 57.5, topLeftY: 57.5 },
{ topLeftX: 140.5, topLeftY: 52 },
{ topLeftX: 136, topLeftY: 70 },
{ topLeftX: 134.3, topLeftY: 88.3 },
{ topLeftX: 270.5, topLeftY: 68.8 },
{ topLeftX: 211.7, topLeftY: 135.3 },
{ topLeftX: 245.5, topLeftY: 189.7 },
{ topLeftX: 199.5, topLeftY: 222.5 },
{ topLeftX: 128.5, topLeftY: 241.6 },
{ topLeftX: 174.3, topLeftY: 263.5 },
{ topLeftX: 167.8, topLeftY: 285.7 },
{ topLeftX: 134, topLeftY: 309 },
{ topLeftX: 251, topLeftY: 304.6 }];

let newMarkerCoords = markerCoords.map(({topLeftY, topLeftX}) => {
    return {topLeftY: topLeftY * 2, topLeftX: topLeftX * 2}
});

console.log(newMarkerCoords);

您沒有從 map 函式正確回傳花括號構成函式的主體，但沒有回傳任何內容。

const markerCoords = [
{ topLeftX: 68.5, topLeftY: 19 },
{ topLeftX: 57.5, topLeftY: 57.5 },
{ topLeftX: 140.5, topLeftY: 52 },
{ topLeftX: 136, topLeftY: 70 },
{ topLeftX: 134.3, topLeftY: 88.3 },
{ topLeftX: 270.5, topLeftY: 68.8 },
{ topLeftX: 211.7, topLeftY: 135.3 },
{ topLeftX: 245.5, topLeftY: 189.7 },
{ topLeftX: 199.5, topLeftY: 222.5 },
{ topLeftX: 128.5, topLeftY: 241.6 },
{ topLeftX: 174.3, topLeftY: 263.5 },
{ topLeftX: 167.8, topLeftY: 285.7 },
{ topLeftX: 134, topLeftY: 309 },
{ topLeftX: 251, topLeftY: 304.6 }];

let newMarkerCoords = markerCoords.map(({topLeftY, topLeftX}) => Object.assign({}, {topLeftY: topLeftY * 2, topLeftX: topLeftX * 2}));

console.log(newMarkerCoords);

你可以做類似的事情。

轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/481657.html

標籤：javascript 反应

上一篇：如何將通用回呼作為具體引數傳遞？

下一篇：如何測驗欄位是否為空html