Как изменить значения дочерних элементов массива объектов?

Question

У меня есть массив как это:

const mockObjPanoramas = [{ 
    'id': '7oADHnGZcr', 
    'appMarkers': [{ 
     'panoId': '7oADHnGZcr', 
     'color': 'red', 
     'x': 0, 
     'y': 0, 
     'z': 1000 
    }, { 
     'panoId': '8szmQ8ELKs', 
     'color': 'red', 
     'x': 100, 
     'y': 0, 
     'z': 1000 
    }] 
    }, { 
    'id': '8szmQ8ELKs', 
    'appMarkers': [{ 
     'panoId': '7oADHnGZcr', 
     'color': 'green', 
     'x': 0.1352234, 
     'y': -0.2600403, 
     'z': 0.9960099 
    }, { 
     'panoId': '8szmQ8ELKs', 
     'color': 'green', 
     'x': 0.03900146, 
     'y': 0.295959, 
     'z': 0.9169907 
    }] 
    }] 

Я хочу применить следующую формулу для каждого appMarker и возвращает новый массив:

(x, y, z) = (-z, y, -x) * 1000 

Так что я сделал это:

function parseUnityMarkers (mockObjPanoramas) { 
    return mockObjPanoramas.map(mockObjPanorama => { 
    return mockObjPanorama.appMarkers.map(appMarker => { 
     const depth = 1000 
     appMarker.x = -appMarker.z * depth 
     appMarker.y = appMarker.y * depth 
     appMarker.z = -appMarker.x * depth 
    }) 
    }) 
} 

Тем не менее, я получаю это:

Что я делаю неправильно?

ПРИМЕЧАНИЕ: Я хочу вернуть новый массив, идентичный оригинальному. Но с изменением значений x, y и z из appMarkers.

Answer 1

Сделано это просто (мне нравится делать вещи простым способом :)):

function parseUnityMarkers(mockObjPanoramas) { 
     for(var i=0; i < mockObjPanoramas.length; i++){ 
     var temp1 = mockObjPanoramas[i]; 
     for(var j=0; j < temp1.appMarkers.length; j++) { 
      var temp2 = temp1.appMarkers[j]; 
      const depth = 1000; 
      var x = temp2.x; 
      temp2.x = -temp2.z * depth 
      temp2.y = temp2.y * depth 
      temp2.z = -x * depth 
     } 
     } 
     return mockObjPanoramas; 
    } 

одна важная вещь:

когда вы делаете:

appMarker.x = -appMarker.z * depth 
    appMarker.y = appMarker.y * depth 
    appMarker.z = -appMarker.x * depth 

Обратите внимание, что у вас есть сделал значение z как: -z * depth * depth , поскольку вы уже заменили x на -z * depth.

const mockObjPanoramas = [{ 
 
    'id': '7oADHnGZcr', 
 
    'appMarkers': [{ 
 
    'panoId': '7oADHnGZcr', 
 
    'color': 'red', 
 
    'x': 0, 
 
    'y': 0, 
 
    'z': 1000 
 
    }, { 
 
    'panoId': '8szmQ8ELKs', 
 
    'color': 'red', 
 
    'x': 100, 
 
    'y': 0, 
 
    'z': 1000 
 
    }] 
 
}, { 
 
    'id': '8szmQ8ELKs', 
 
    'appMarkers': [{ 
 
    'panoId': '7oADHnGZcr', 
 
    'color': 'green', 
 
    'x': 0.1352234, 
 
    'y': -0.2600403, 
 
    'z': 0.9960099 
 
    }, { 
 
    'panoId': '8szmQ8ELKs', 
 
    'color': 'green', 
 
    'x': 0.03900146, 
 
    'y': 0.295959, 
 
    'z': 0.9169907 
 
    }] 
 
}]; 
 

 
function parseUnityMarkers(mockObjPanoramas) { 
 
    for(var i=0; i < mockObjPanoramas.length; i++){ 
 
    var temp1 = mockObjPanoramas[i]; 
 
    for(var j=0; j < temp1.appMarkers.length; j++) { 
 
     var temp2 = temp1.appMarkers[j]; 
 
     const depth = 1000; 
 
     var x = temp2.x; 
 
     temp2.x = -temp2.z * depth 
 
     temp2.y = temp2.y * depth 
 
     temp2.z = -x * depth 
 
    } 
 
    } 
 
    return mockObjPanoramas; 
 
} 
 

 
console.log(parseUnityMarkers(mockObjPanoramas));

Answer 2

Я думаю, вы пропустили оператор возврата из вашего второго вызова карты:

function parseUnityMarkers (mockObjPanoramas) { 
    return mockObjPanoramas.map(mockObjPanorama => { 
    return mockObjPanorama.appMarkers.map(appMarker => { 
     const depth = 1000 
     appMarker.x = -appMarker.z * depth 
     appMarker.y = appMarker.y * depth 
     appMarker.z = -appMarker.x * depth 
     return appMarker; 
    }) 
    }) 
} 

Однако, вы собираетесь столкнуться с другой проблемой. Вы переписываете значение appMarker.x, а затем пытаетесь получить доступ к исходному значению после этого. Кроме того, вы фактически перезаписываете свои исходные данные. Вы можете сохранить исходные данные от изменения, как это:

function parseUnityMarkers (mockObjPanoramas) { 
    return mockObjPanoramas.map(mockObjPanorama => { 
    return { 
     id: mockObjPanorama.id, 
     appMarkers: mockObjPanorama.appMarkers.map(appMarker => { 
     const depth = 1000 
     return { 
      panoId: appMarker.panoId, 
      color: appMarker.color, 
      x: -appMarker.z * depth, 
      y: appMarker.y * depth, 
      z: -appMarker.x * depth 
     }; 
     }) 
    } 
    }) 
}