Mekko - Graphy SDK

Mekko charts (also called marimekko or market map charts) display stacked bars with variable widths, showing both size and composition simultaneously.

When to use

Market share analysis - Show market size and segment composition
Portfolio breakdown - Display size and composition of groups
Two-dimensional part-to-whole - Compare both totals and proportions
Strategic positioning - Visualise competitive landscape

Basic example

const config: GraphConfig = {
  type: 'mekko',
  data: {
    columns: [
      { key: 'region', label: 'Region' },
      { key: 'product_a', label: 'Product A' },
      { key: 'product_b', label: 'Product B' },
      { key: 'product_c', label: 'Product C' },
    ],
    rows: [
      { region: 'North America', product_a: 120, product_b: 80, product_c: 50 },
      { region: 'Europe', product_a: 90, product_b: 110, product_c: 40 },
      { region: 'Asia Pacific', product_a: 200, product_b: 150, product_c: 100 },
      { region: 'Latin America', product_a: 40, product_b: 30, product_c: 20 },
    ],
  },
};

Data structure

Mekko charts require:

First column: Categories (becomes variable-width bars)
Remaining columns: Numeric values (stacked segments within each bar)

Bar - Fixed-width stacked bars
Column - Percentage composition