Skip to content

Commit

Permalink
[path-marker-layer] Fix incorrectly positioned arrows (uber#730)
Browse files Browse the repository at this point in the history 
* Revert "Fix "Cannot read properties of undefined (reading 'clone')" (uber#671)"

This reverts commit 96229b0.

* [path-marker-layer] Fix incorrectly positioned arrows
  • Loading branch information
@NameFILIP
NameFILIP authored Feb 23, 2022
1 parent cad9354 commit 94fb490
Show file tree
Hide file tree
Showing 3 changed files with 303 additions and 7 deletions.
17 changes: 10 additions & 7 deletions modules/layers/src/layers/path-marker-layer/create-path-markers.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,23 +72,26 @@ function createMarkerAlongPath({ path, percentage, lineLength, color, object, pr
const distanceAlong = lineLength * percentage;
let currentDistance = 0;
let previousDistance = 0;

for (let i = 0; i < path.length - 1; i++) {
let i = 0;
for (i = 0; i < path.length - 1; i++) {
currentDistance += path[i].distance(path[i + 1]);
if (currentDistance > distanceAlong) {
break;
}
previousDistance = currentDistance;
}

const lastPoint = path[path.length - 1];
const beforeLastPoint = path[path.length - 2];
// If reached the end of the loop without exiting early,
// undo the final increment to avoid a null-pointer exception
if (i === path.length - 1) {
i -= 1;
}

const vDirection = lastPoint.clone().subtract(beforeLastPoint).normalize();
const vDirection = path[i + 1].clone().subtract(path[i]).normalize();
const along = distanceAlong - previousDistance;
const vCenter = vDirection.clone().multiply(new Vector2(along, along)).add(beforeLastPoint);
const vCenter = vDirection.clone().multiply(new Vector2(along, along)).add(path[i]);

const vDirection2 = new Vector2(projectFlat(lastPoint)).subtract(projectFlat(beforeLastPoint));
const vDirection2 = new Vector2(projectFlat(path[i + 1])).subtract(projectFlat(path[i]));

const angle = (vDirection2.verticalAngle() * 180) / Math.PI;

Expand Down
170 changes: 170 additions & 0 deletions ...s/layers/test/lib/layers/path-marker-layer/__snapshots__/create-path-markers.test.ts.snap
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,170 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`test createPathMarkers 1`] = `
Array [
Object {
"angle": -97.30808486223859,
"color": Array [
0,
0,
0,
255,
],
"object": Object {
"direction": Object {
"backward": false,
"forward": true,
},
"path": Array [
Array [
-122.419385,
37.775412,
],
Array [
-122.4196034,
37.7753836,
],
Array [
-122.419815,
37.775356,
],
Array [
-122.4199019,
37.7753448,
],
Array [
-122.420337,
37.775289,
],
Array [
-122.420432,
37.7752776,
],
],
},
"position": Array [
-122.41990839434719,
37.77534396712348,
0,
],
},
Object {
"angle": -12.766852083123982,
"color": Array [
0,
0,
0,
255,
],
"object": Object {
"direction": Object {
"backward": false,
"forward": true,
},
"path": Array [
Array [
-122.419556,
37.776966,
],
Array [
-122.419631,
37.777297,
],
],
},
"position": Array [
-122.41959349999999,
37.777131499999996,
0,
],
},
Object {
"angle": 136.64059263100177,
"color": Array [
0,
0,
0,
255,
],
"object": Object {
"direction": Object {
"backward": false,
"forward": true,
},
"path": Array [
Array [
-122.4232649,
37.7715712,
],
Array [
-122.4231892,
37.7714474,
],
Array [
-122.4230516,
37.7712495,
],
Array [
-122.4229364,
37.7711068,
],
Array [
-122.4228177,
37.7709811,
],
Array [
-122.4226595,
37.770835,
],
Array [
-122.4225099,
37.7707146,
],
Array [
-122.4224446,
37.7706699,
],
],
},
"position": Array [
-122.42290555432264,
37.77107413528523,
0,
],
},
Object {
"angle": 127.35649243207592,
"color": Array [
0,
0,
0,
255,
],
"object": Object {
"direction": Object {
"backward": false,
"forward": true,
},
"path": Array [
Array [
-122.417263,
37.7763419,
],
Array [
-122.417163,
37.776264,
],
Array [
-122.4169496,
37.7761011,
],
],
},
"position": Array [
-122.41710667970543,
37.77622100761018,
0,
],
},
]
`;
123 changes: 123 additions & 0 deletions modules/layers/test/lib/layers/path-marker-layer/create-path-markers.test.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,123 @@
import createPathMarkers from '../../../../src/layers/path-marker-layer/create-path-markers';

const data = [
{
path: [
[-122.419385, 37.775412],
[-122.4196034, 37.7753836],
[-122.419815, 37.775356],
[-122.4199019, 37.7753448],
[-122.420337, 37.775289],
[-122.420432, 37.7752776],
],
direction: {
forward: true,
backward: false,
},
},
{
path: [
[-122.4239121, 37.7739008],
[-122.424018, 37.773888],
],
direction: {
forward: false,
backward: false,
},
},
{
path: [
[-122.419556, 37.776966],
[-122.419631, 37.777297],
],
direction: {
forward: true,
backward: false,
},
},
{
path: [
[-122.4232649, 37.7715712],
[-122.4231892, 37.7714474],
[-122.4230516, 37.7712495],
[-122.4229364, 37.7711068],
[-122.4228177, 37.7709811],
[-122.4226595, 37.770835],
[-122.4225099, 37.7707146],
[-122.4224446, 37.7706699],
],
direction: {
forward: true,
backward: false,
},
},
{
path: [
[-122.421459, 37.7756509],
[-122.4214451, 37.7755683],
[-122.4214282, 37.7755459],
[-122.4213833, 37.7755382],
[-122.4212633, 37.7755543],
],
direction: {
forward: false,
backward: false,
},
},
{
path: [
[-122.41515, 37.77588],
[-122.415508, 37.775601],
],
direction: {
forward: false,
backward: false,
},
},
{
path: [
[-122.417263, 37.7763419],
[-122.417163, 37.776264],
[-122.4169496, 37.7761011],
],
direction: {
forward: true,
backward: false,
},
},
{
path: [
[-122.4205054, 37.7733851],
[-122.4203894, 37.773298],
],
direction: {
forward: false,
backward: false,
},
},
{
path: [
[-122.4245033, 37.7762476],
[-122.4244959, 37.7762071],
],
direction: {
forward: false,
backward: false,
},
},
{
path: [
[-122.415898, 37.777819],
[-122.416311, 37.777494],
],
direction: {
forward: false,
backward: false,
},
},
];

it('test createPathMarkers', () => {
const result = createPathMarkers({ data, projectFlat: (x) => x });
expect(result).toMatchSnapshot();
});

0 comments on commit 94fb490

Please sign in to comment.