JSFiddle - React, Tailwind, and code Playground

by iDVB

HTML

<div id="logDiv" style="width:200px; padding:5px; border:solid 1px #000;">
</div>

JavaScript

const getLabelPixels = (timeline, start, end) => {
  console.log({
    tlStart: timeline.startTime(),
    labels: timeline.labels,
    duration: timeline.duration(),
    start,
    end,
  })

  return objReduce(
    timeline.labels,
    (acc, key) => ({
      ...acc,
      [key]: Math.round(
        (timeline.labels[key] / timeline.duration()) * (end - start) + start
      ),
    }),
    {}
  )
}


var tl1 = gsap.timeline();
var tl2 = gsap.timeline();
var logDiv = $("div#logDiv");

tl2.addLabel("tl2");
tl1.append(tl2);

console.log(tl2.labels);