Skip to main content
V
Variantti
Participating Frequently
March 20, 2024
Question

Expression to calculate the sum of the lengths of trim paths

  • March 20, 2024
  • 1 reply
  • 226 views

On a shape layer I have a group that contains a stroked path with a trim path operator. I'd like to fill the whole path with stroke segments of different color and length by duplicating the group. The color part is working but I am getting confused how to calculate the starting and end points for each segment. Offset will be used to drive the animation. 

 

For the Start value this works fine (it sums the values of End):

 

 

var segmentId = thisProperty.propertyGroup(3).propertyIndex;
var numberOfSegments = thisLayer("Contents").numProperties;
 
var startPercentage = 0;
 
for(var i = numberOfSegments; i > segmentId; i--) {
    startPercentage += thisLayer("Contents")(segmentId).content("Trim Paths 1").end;
}
startPercentage;
 
 
But how do I calculate the end value for each. This is my attempt but it is not working. The logic is to find out the end value of the previous segment and add the new length to it. At the moment it just shoots both Start and End to 100%. There is some kind of unwated reference loop? 
 
 
var segmentId = thisProperty.propertyGroup(3).propertyIndex;
var numberOfSegments = thisLayer("Contents").numProperties;
var previousSegmentEnd = numberOfSegments < 2 ? 0 : thisLayer("Contents")(segmentId + 1).content("Trim Paths 1").end;
 
var segmentLengths = [6, 8, 10, 13, 16, 21];
seedRandom(segmentId, timeless=true);
var currentLength = segmentLengths[Math.floor(random(segmentLengths.length))];
 
previousSegmentEnd + currentLength;

 

 

Probably simple but I just seem to be stuck with this. Any help is much appreciated. 

 

 

    This topic has been closed for replies.

    1 reply

    Mylenium
    Mylenium
    Legend
    March 20, 2024

    I see no provision to actually check whether the values are legally between 0 and 100, which could already be the issue.

     

    Mylenium

    V
    VarianttiAuthor
    Participating Frequently
    March 20, 2024

    I think I figured it out. The code was waaay off. Probably should implement Mylenium's suggestion but here's the code:

    For the Start value:

     

     

    var segmentId = thisProperty.propertyGroup(3).propertyIndex;
    var numberOfSegments = thisLayer("Contents").numProperties;
     
    var startPercentage = 0;
     
    // sum the lengths below this segment
    if( numberOfSegments > 1 ){ 
    for(var i = segmentId + 1; i <= numberOfSegments; i++) {
    startPercentage += thisLayer("Contents")(i).content("Trim Paths 1").end - thisLayer("Contents")(i).content("Trim Paths 1").start;
    }
    }
     
    startPercentage;
     
     
     
    For the End value:
     
     
    var segmentId = thisProperty.propertyGroup(3).propertyIndex;
    var numberOfSegments = thisLayer("Contents").numProperties;
     
    var previousSegmentEnd = 0;
     
    if( segmentId + 1 <= numberOfSegments) {
    previousSegmentEnd = thisLayer("Contents")(segmentId + 1).content("Trim Paths 1").end;
    }
     
     
    previousSegmentEnd + 10;

     

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices