Bespoke Visual Layouts with Charticulator Daniel Marsh-Patrick Bespoke Visual Layouts with Charticulator
Daniel Marsh-Patrick BI Consultant Power BI custom visuals author @the_d_mp daniel-m-p coacervo.co BI Consultant Power BI custom visuals author Loves The Data
Overview By Microsoft Research Free and open source Bespoke chart designs, without programming Interactive editor Reusable designs and templates
Where to find the Application charticulator.com charts.powerbi.tips Build from source (GitHub)
Source Data Use CSV format data First row must contain column names Can provide additional CSV for source/target entity linking (not in scope for today)
Components Charts built using: Marks Glyphs Guides Plot Segments Scaffolds/Axes
Mark Primitive graphical elements Shape Symbol Line Text Graphic Axis Nested Chart
Glyph Representation of single data row Contains one or more marks 1 2
Guide Auxiliary element for positioning marks/glyphs Use to ‘snap’ elements Do not appear when exported
Plot Segment Lays out a set of glyphs Rectangular (default) or linear Direction can be assigned either one of: Scaffold Categorical Axis Numerical Axis
Scaffold Stacks glyphs sequentially within plot segment (without data binding) 3 coordinate systems: Cartesian - horizontal and/or vertical Polar Curve-based
Axis Specifies layout bound to data properties Categorical axis groups glyphs (evenly) by categorical attribute Numeric axis positions glyphs according to their numeric values
Layout Composition Combine scaffolds/axes for flexible designs! Categorical axes can contain sub-layouts Sub-layouts determine “within group” layout
Sample Chart
Re-using Save as .chart file Export process: Image HTML Charticulator Template (for nested charts) Power BI Custom Visual
Power BI Demo
Stretch Goal – Small Multiples for Year
Resources Charticulator – Site Charticulator @ powerbi.tips Chart gallery Video tutorials Charticulator @ powerbi.tips Nick Snapp’s public share Number formatting helper Whitepaper
Thanks to our great Sponsors Gold Sponsors Silver Sponsors Global Sponsors Bronze Sponsors