The dashboard after Phase 2
This is the whole lumen-dashboard/index.html after Phase 2, exactly as in the Files section. Make the preview narrow to see the boxes stack and the plan table scroll.
Write a chart plan into your dashboard (which chart answers which team question), then replace the pie idea with a hand-made, sorted picture of the five emptiest stations. It answers Priya's question: which stations run out of bikes?
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 4 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Write bar(x0, y, share, scale) that returns the SVG string for a bar and returns an empty string for a missing or negative share. Test (110, 30, 0.2, 240) and (110, 30, -0.1, 240).
Name two situations where a pie chart cannot show the data, and the chart you use instead.
Explain it without notes
Why is the five-station chart sorted and measured as bikes ÷ docks rather than listed by station number with raw bike counts?
How is each bar's width worked out, and why is Clock Tower's 48?
What did the plan decide for Meera's question, and why isn't it a chart?
Preview
Console
Nothing logged yet.Expected console output
Bars: 7
Tallest bar: 160 (Tuesday)
Chart shape (height / width): 0.553 at any size
Titled boxes: 4
Low stations: 5
Emptiest first: true
Plan rows: 7