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"
This problem asks you to layout daily calendar events into pixel-based bounding boxes.
Each event becomes a rectangle with:
- top = start time
- height = end – start
- width = either full (320px) or half (160px) depending on overlap
- left = 0 or 160 based on its column
If two or more events overlap in time, they must be displayed side-by-side in equal-width columns.
If an event does not overlap with any other event, it occupies the full width.
The VOprep team has long accompanied candidates through various major company OAs and VOs, including Tiktok, Google, Amazon, Citadel, SIG, providing real-time voice assistance, remote practice, and interview pacing reminders to help you stay smooth during critical moments. If you are preparing for Tiktok or similar engineering-focused companies, you can check out our customized support plans—from coding interviews to system design, we offer full guidance to help you succeed.
