Skip to content

Commit

Permalink
use full xyz object or position.setX/setY/setZ api
Browse files Browse the repository at this point in the history
  • Loading branch information
@vincentfretin
vincentfretin committed Sep 8, 2024
1 parent 8de46fd commit 30c7712
Show file tree
Hide file tree
Showing 3 changed files with 47 additions and 28 deletions.
41 changes: 22 additions & 19 deletions src/aframe-streetmix-parsers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -300,7 +300,7 @@ function createSidewalkClonedVariants(
10
);
const dividerParentEl = createParentElement('pedestrians-parent');
dividerParentEl.setAttribute('position', { y: elevationPosY });
dividerParentEl.object3D.position.setY(elevationPosY);
// Randomly generate avatars
for (let i = 0; i < totalPedestrianNumber; i++) {
const variantName =
Expand Down Expand Up @@ -690,7 +690,8 @@ function createOutdoorDining(length, posY) {
reusableObjectEl.setAttribute('mixin', 'outdoor_dining');

// const positionZ = randomPosition(reusableObjectEl, 'z', length, outdorDiningLength);
reusableObjectEl.setAttribute('position', { y: posY, z: randPosZ });
reusableObjectEl.object3D.position.setY(posY);
reusableObjectEl.object3D.position.setZ(randPosZ);
outdoorDiningParentEl.append(reusableObjectEl);
});

Expand Down Expand Up @@ -729,7 +730,8 @@ function createMicroMobilityElement(
const reusableObjectEl = document.createElement('a-entity');
const rotationY = variantList[0] === 'inbound' ? 0 : 180;
reusableObjectEl.setAttribute('rotation', '0 ' + rotationY + ' 0');
reusableObjectEl.setAttribute('position', { y: posY, z: randPosZ });
reusableObjectEl.object3D.position.setY(posY);
reusableObjectEl.object3D.position.setZ(randPosZ);

if (animated) {
reusableObjectEl.setAttribute('animation-mixer', '');
Expand Down Expand Up @@ -774,7 +776,7 @@ function createFlexZoneElement(variantList, length, showVehicles = true) {
} else if (variantList[0] === 'rideshare') {
reusableObjectEl.setAttribute('mixin', 'sedan-rig');
}
reusableObjectEl.setAttribute('position', { z: randPosZ });
reusableObjectEl.object3D.position.setZ(randPosZ);
flexZoneParentEl.append(reusableObjectEl);
});

Expand Down Expand Up @@ -823,7 +825,8 @@ function createBenchesParentElement() {
function createBikeRacksParentElement(posY) {
const placedObjectEl = document.createElement('a-entity');
placedObjectEl.setAttribute('class', 'bikerack-parent');
placedObjectEl.setAttribute('position', { y: posY, z: -3.5 });
placedObjectEl.object3D.position.setY(posY);
placedObjectEl.object3D.position.setZ(-3.5);
return placedObjectEl;
}

Expand All @@ -833,7 +836,7 @@ function createBikeShareStationElement(variantList, posY) {
placedObjectEl.setAttribute('mixin', 'bikeshare');
const rotationCloneY = variantList[0] === 'left' ? 90 : 270;
placedObjectEl.setAttribute('rotation', '0 ' + rotationCloneY + ' 0');
placedObjectEl.setAttribute('position', { y: posY });
placedObjectEl.object3D.position.setY(posY);
return placedObjectEl;
}

Expand All @@ -848,7 +851,7 @@ function createParkletElement(length, variantList) {
placedObjectEl.setAttribute('position', { x: 0, y: 0.02, z: randPosZ });
placedObjectEl.setAttribute('mixin', 'parklet');
const rotationY = variantList[0] === 'left' ? 90 : 270;
placedObjectEl.setAttribute('rotation', { y: rotationY });
placedObjectEl.setAttribute('rotation', { x: 0, y: rotationY, z: 0 });
parkletParent.append(placedObjectEl);
});
return parkletParent;
Expand All @@ -875,7 +878,7 @@ function createBusStopElement(rotationBusStopY, posY) {
placedObjectEl.setAttribute('class', 'bus-stop');
placedObjectEl.setAttribute('rotation', '0 ' + rotationBusStopY + ' 0');
placedObjectEl.setAttribute('mixin', 'bus-stop');
placedObjectEl.setAttribute('position', { y: posY });
placedObjectEl.object3D.position.setY(posY);
return placedObjectEl;
}

Expand Down Expand Up @@ -923,7 +926,7 @@ function createSegmentElement(
width: ${segmentWidthInMeters};`
);

segmentEl.setAttribute('position', { y: positionY });
segmentEl.object3D.position.setY(positionY);
segmentEl.setAttribute('mixin', mixinId);

if (repeatCount.length !== 0) {
Expand Down Expand Up @@ -1793,7 +1796,7 @@ function processBuildings(left, right, streetWidth, showGround, length) {
segmentsDepth: 10,
segmentsWidth: 10
});
groundParentEl.setAttribute('position', { y: -3 });
groundParentEl.object3D.position.setY(-3);
} else {
groundParentEl = document.createElement('a-box');
groundParentEl.setAttribute('depth', length);
Expand All @@ -1805,14 +1808,13 @@ function processBuildings(left, right, streetWidth, showGround, length) {
'mixin',
variantToMaterialMapping[currentValue]
); // case grass, fence
groundParentEl.setAttribute('position', { y: -1 });
groundParentEl.object3D.position.setY(-1);
}

if (side === 'right') {
// groundParentEl.setAttribute('position', groundPositionX + ' -1 0');
groundParentEl.setAttribute('position', { x: groundPositionX });
groundParentEl.object3D.position.setX(groundPositionX);
} else {
groundParentEl.setAttribute('position', { x: groundPositionX });
groundParentEl.object3D.position.setX(groundPositionX);
}
groundParentEl.classList.add('ground-' + side);
groundParentEl.setAttribute(
Expand Down Expand Up @@ -1856,13 +1858,14 @@ function processBuildings(left, right, streetWidth, showGround, length) {
const objectPositionX = buildingPositionX - (sideMultiplier * 150) / 2;
const placedObjectEl = document.createElement('a-entity');
placedObjectEl.setAttribute('class', 'seawall-parent');
placedObjectEl.setAttribute('position', { x: objectPositionX, z: 4.5 }); // position="1.043 0.100 -3.463"
placedObjectEl.object3D.position.setX(objectPositionX);
placedObjectEl.object3D.position.setZ(4.5); // position="1.043 0.100 -3.463"
let rotationCloneY;
if (currentValue === 'compound-wall') {
placedObjectEl.setAttribute('position', { y: 3 });
placedObjectEl.setAttribute('position', {
x: objectPositionX + 1.5 * sideMultiplier
});
placedObjectEl.object3D.position.setY(3);
placedObjectEl.object3D.position.setX(
objectPositionX + 1.5 * sideMultiplier
);
rotationCloneY = side === 'left' ? 90 : -90;
} else {
rotationCloneY = side === 'left' ? -90 : 90;
Expand Down
32 changes: 24 additions & 8 deletions src/components/intersection.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -347,40 +347,56 @@ AFRAME.registerComponent('intersection', {

if (crosswalklArray[0]) {
const cw1 = document.createElement('a-entity');
cw1.setAttribute('position', { x: intersectWidth / 2 - 2, z: 0.11 });
cw1.setAttribute('position', {
x: intersectWidth / 2 - 2,
y: 0,
z: 0.11
});
cw1.setAttribute('rotation', { x: 0, y: 0, z: 180 });
cw1.setAttribute('scale', { y: intersectDepth / 12 });
cw1.setAttribute('scale', { x: 1, y: intersectDepth / 12, z: 1 });
cw1.setAttribute('mixin', 'markings crosswalk-zebra');
cw1.setAttribute('data-layer-name', 'Crosswalk • East');
cw1.classList.add('autocreated');
el.appendChild(cw1);
}
if (crosswalklArray[1]) {
const cw2 = document.createElement('a-entity');
cw2.setAttribute('position', { x: -intersectWidth / 2 + 2, z: 0.11 });
cw2.setAttribute('position', {
x: -intersectWidth / 2 + 2,
y: 0,
z: 0.11
});
cw2.setAttribute('rotation', { x: 0, y: 0, z: 180 });
cw2.setAttribute('scale', { y: intersectDepth / 12 });
cw2.setAttribute('scale', { x: 1, y: intersectDepth / 12, z: 1 });
cw2.setAttribute('mixin', 'markings crosswalk-zebra');
cw2.setAttribute('data-layer-name', 'Crosswalk • West');
cw2.classList.add('autocreated');
el.appendChild(cw2);
}
if (crosswalklArray[2]) {
const cw3 = document.createElement('a-entity');
cw3.setAttribute('position', { y: -intersectDepth / 2 + 2, z: 0.11 });
cw3.setAttribute('position', {
x: 0,
y: -intersectDepth / 2 + 2,
z: 0.11
});
cw3.setAttribute('rotation', { x: 0, y: 0, z: 90 });
cw3.setAttribute('scale', { y: intersectWidth / 12 });
cw3.setAttribute('scale', { x: 1, y: intersectWidth / 12, z: 1 });
cw3.setAttribute('mixin', 'markings crosswalk-zebra');
cw3.setAttribute('data-layer-name', 'Crosswalk • Zebra (Continental)');
cw3.classList.add('autocreated');
el.appendChild(cw3);
}
if (crosswalklArray[3]) {
const cw4 = document.createElement('a-entity');
cw4.setAttribute('position', { y: intersectDepth / 2 - 2, z: 0.11 });
cw4.setAttribute('position', {
x: 0,
y: intersectDepth / 2 - 2,
z: 0.11
});
cw4.setAttribute('data-layer-name', 'Crosswalk • Zebra (Continental)');
cw4.setAttribute('rotation', { x: 0, y: 0, z: 90 });
cw4.setAttribute('scale', { y: intersectWidth / 12 });
cw4.setAttribute('scale', { x: 1, y: intersectWidth / 12, z: 1 });
cw4.setAttribute('mixin', 'markings crosswalk-zebra');
cw4.classList.add('autocreated');
el.appendChild(cw4);
Expand Down
2 changes: 1 addition & 1 deletion src/editor/components/components/AddLayerPanel/AddLayerPanel.component.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -173,7 +173,7 @@ const createEntity = (mixinId) => {
const segmentElevationPosY = getSegmentElevationPosY(ancestorEl);
// set position y by elevation level of segment
if (customGroupCreated) {
customGroupEl.setAttribute('position', { y: segmentElevationPosY });
customGroupEl.object3D.position.setY(segmentElevationPosY);
newEntityObject.components.position = { x: 0, y: 0, z: 0 };
} else {
newEntityObject.components.position = {
Expand Down

0 comments on commit 30c7712

Please sign in to comment.