You’re building a daily calendar app and need to display all of the day’s events in the right location on the screen, but it needs to be given a bounding box.
We need to take a list of events happening that day and produce a list of bounding boxes to be drawn.
An event has:
- a title
- a start time (minutes since midnight, e.g., 600 = 10:00am)
- an end time
Example input:
titles: ["In Office"]
startTimes: [600]
endTimes: [900]
Example output:
"title: In Office, top: 600, height: 300, left: 0, width: 320"
A bounding box is defined by:
- top
- left
- height
- width
(All in pixels. 1 min = 1 pixel height. Total available width = 320px.)
When events overlap, they must be drawn in two columns, each taking half the width (160px).
Events that don’t overlap others stay full width (320px).
Example:
titles: ["Meet Kelly", "Meet Henry"]
startTimes: [600, 600]
endTimes: [630, 660]
Output:
"title: Meet Kelly, top: 600, height: 30, left: 0, width: 160"
"title: Meet Henry, top: 600, height: 60, left: 160, width: 160"
这题本质是在实现一个日历应用的事件排版：
- 事件的 top = 开始时间（分钟）
- height = 结束时间 – 开始时间
- 如果事件之间没有重叠，它宽度占满 320px
- 如果事件有时间重叠，需要左右分栏，每栏宽度 160px
left = 0或160来决定放左边还是右边
考点在于：
- 如何判断事件是否重叠
- 如何将重叠事件分组
- 如何在每组内部计算左右布局
- 输出像素级别的 bounding box（top, height, left, width）
这是典型的“Google/Meta/TikTok 日历布局系统设计”面试题。
VOprep 团队长期陪同学员实战各类大厂 OA 与 VO，包括 Tiktok、Google、Amazon、Citadel、SIG 等，提供实时答案助攻、远程陪练与面试节奏提醒，帮助大家在关键时刻不卡壳。
如果你也在准备 Tiktok 或类似工程向公司，可以了解一下我们的定制助攻方案——从编程面到系统设计，全程护航上岸。
正文完
