Projects › Skillmap
A small browser tool for visualizing skills as a treemap, similar to the layouts used for stock-market sector maps. Skills are grouped by category and rated on a 1–5 scale, with box area scaling to the rating. Useful for CVs, application profiles or portfolio pages.
Categories and skills are entered on the left-hand panel. Each skill gets a rating from 1 (basic familiarity) to 5 (expert level), and box area in the treemap scales with that rating — larger box, stronger skill.
The layout is generated with a squarified treemap algorithm (D3.js), the same family of algorithms used for visualizing things like stock market sector performance or disk usage.
The finished diagram is formatted for DIN A4 and can be exported as SVG, PNG or sent straight to a printer’s “Save as PDF” option — ready to drop into a CV or application.
A profile can also be saved and reloaded as a JSON file, so it’s easy to keep editing later.
React for the UI and D3.js for the treemap layout. Runs entirely client-side — no data leaves the browser.