Module placement not showing correct angle

[Gautam2010]

I am trying to draw model on chains using layout.childrenOnChain but some of modules are not placed correctly.
Any idea on this?

Code reproduced here
https://codesandbox.io/s/makerjs-module-placement-angle-are-incorrect-mrrrwv

[Gautam2010]

@danmarshall
I was wondering if this fix is currently planned for a future sprint, or if it's still under consideration

[danmarshall]

Hi @Gautam2010 I tried taking a look but ran out of time as it was a somewhat complicated scenario. I do remember in the code that there were 3 chains found. Knowing that the layout is based on chainToPoints I tried to just get the points then see that using ConnectTheDots. I spent a bit of time with your example code but spent much time with the React / updating loop in CodeSandbox. Can you simplify the repro without using React?

[Gautam2010]

@danmarshall
I have added repo here in nodeJs as well, Index.js has the code reproduced.
https://codesandbox.io/p/sandbox/dreamy-nova-sh3fhm

[noobd3v]

Hi @danmarshall I was working on the issue and noticed that the way the angles are calculated for the rotation are dependent on the position of points with respect to the other position points which works but only when children on chain are closely placed.

maker.js/packages/maker.js/src/core/layout.ts

Line 154 in fb569bc

function miterAngles(points: IPoint[], offsetAngle: number): number[] {

            if (i === 0) {
                a = angle.ofPointInDegrees(p, points[i + 1]) + 90;
            } else if (i === points.length - 1) {
                a = angle.ofPointInDegrees(points[i - 1], p) + 90;
            } else {
                arc.origin = p;
                arc.startAngle = angle.ofPointInDegrees(p, points[i + 1]);
                arc.endAngle = angle.ofPointInDegrees(p, points[i - 1]);
                a = angle.ofArcMiddle(arc);
            }

In this case the points are far apart from each other hence the issue.
It will be better if we can have the rotation angle set in respect with the path on which it is getting placed instead previous and next points.

[noobd3v]

There could be multiple ways of updating

1. Could be to take argument for distance of previous and next point just for rotation angle calculation. Baseline for mitered angle previous next points.
2. Take the path segment at the position or use complete path under the children to get the angle.

I guess best would be to use the path segment for the placement point to get the angle.

[danmarshall]

@noobd3v thanks for working on the issue 👍🏽 and you are correct that is the method for layout. I agree that the method you suggest may also be useful. There's scenarios where each style might be appropriate, so this could be a new option.

[noobd3v]

Hi @danmarshall I tried updating the existing function and added the extra parameter to take as flag for rotation along the placed path.
I used following approach.

1. So that we don't have to traverse the whole chain to get the path for the cpa point I updated the toPoints method of chain to provide path context of the point (it can be helpful in some other applications of toPoints so created an overload with callback similar to what is done with findChains).
2. Used the path context to get the angle made by endpoints.
3. Assigned the angle for rotation.
   But it is not providing the required results. One thing that's not clear to me was the points that are being generated, below is the screenshot of the points with respect to the path and the points are not on the path.

Here are the changes for your reference that I have done to achieve the functionality. Can you please look into it let me know where I am wrong about my approach.
master...noobd3v:maker.js:rotation-along-path

Result:

[noobd3v]

I might be providing more than enough information in the callback but I thought it might be useful in some cases.

[noobd3v]

Got what I was doing wrong.
I was using the 1st index of the points which was the start and should be avoided.
And the points were the mirror of the actual shape.

But it is not providing the required results. One thing that's not clear to me was the points that are being generated, below is the screenshot of the points with respect to the path and the points are not on the path.

Updated Result.

[noobd3v]

Created PR for feature.
#566