如何将字幕限制为两行？

Question

我正在使用Google服务来为我的实时流生成实时字幕。字幕采用以下格式：{开始：0，成绩单：“ hello world”，结束：15}

现在，问题在于这些对象重叠。因此，如果第一个字幕的持续时间是从0到15，第二个字幕的持续时间是12到23。也可能是第一个字幕的持续时间为3行数据，第二个字幕对象的持续时间为2行数据。我想确保以不超过2行的标题显示没有损失。

我尝试将标题对象分割为两个较小的对象，但是分割持续时间的问题来了，重叠的问题也来了。我想知道人们在使用字幕时是否会遇到类似的问题？请指导我。我无法在线找到解决方案。

我正在使用下面的代码每秒更新字幕显示日志（此代码当前正在控制台记录）。

function updateCaptionsText() {
  let pastIndex;
  let currentIndex;


//captions is an array storing captions objects in sequential order. and gets appended with new caption object every time a new object comes from live transcriptions service.***


// to mark captions as pastIndex whose end time is before current player time to splice them and mark captions as current to show them
  if (!isNaN(playerTime) && playerTime > 0) {
    for (let i = 0; i < captions.length; i++) {
      if (captions[i].start <= playerTime) {
        if (captions[i].end <= playerTime) {
          pastIndex = i;
        } else {
          currentIndex = i;
        }
      } else {
        break;
      }
    }
  }

  if (!isNaN(pastIndex) && pastIndex >= 0) {
        captions.splice(0, pastIndex + 1);
  }

  if(!isNaN(pastIndex)){
    currentIndex = currentIndex - pastIndex - 1;
  }

  let captionText: string = "";
    if (!isNaN(currentIndex) && currentIndex >= 0) {
        captions.slice(0, currentIndex + 1).forEach((caption) => {
            captionText += `${caption.transcript}\n`;
        });
    }


 console.log(`{captionText}`);
}

Answer 1

[
  { start: 0, transcript: "hello world", end: 15 },
  { start: 10, transcript: "world yolo!", end: 20 },
  { start: 18, transcript: "yolo! bonjour le monde", end: 24 }
]

假设您获得此数据。您要摆脱previous项目中的重叠部分。对于上面的示例，您希望“世界”从第一项消失，而“ yolo！”从第二项走了。然后忽略end字段，它将变得无用。

[
  { start: 0, transcript: "hello " },
  { start: 10, transcript: "world " },
  { start: 18, transcript: "yolo! bonjour le monde" }
]

基本上，您将这些数据处理为一段带有时间标记的文本。

0     10    18
hello world yolo! bonjour le monde

明智的代码，非常简单：

const myCaptions = originalCaptions.map((item, index) => {
  if (index + 1 === items.length) return item

  const left = item
  const right = items[index+1]
  const leftText = left.transcript
  const rightText = right.transcript
  const len = Math.min(leftText.length, rightText.length)
  const leftLen = leftText.length

  let found
  for (let i = 1; i < len; i++) {
    const leftSeg = leftText.slice(leftLen - i, leftLen)
    const rightSeg = rightText.slice(0, i)
    if (leftSeg === rightSeg) {
      found = i
      break
    }
  }

  if (found) {
    return {
      start: item.start,
      transcript: leftText.slice(0, leftText.length - found)
    }
  }

  return item
})

function updateCaptionsText() {
  const captions = myCaptions.filter(item => item.start < playerTime)
  const captionText = captions.reduce((text, item) => {
    return text += item.transcript
  }, '')
  console.log(`{captionText}`)
}