Lattice Grid Buy a licence

demo D269

Slope chart

Two points per line so the direction of change from one period to the next is the message

type: 'slope', x, series, y

Building…
Loading a live grid…

The configuration

'chart-types-slope': () => ({
  rows: [], config: {},
  foot: ['a line from one year to the next, per region', 'the slope is the story: up, down or flat'],
  mount: mountGridCharts({
    rows: twoPeriodRows(),
    columns: [
      { field: 'region', title: 'Region', layout: { pin: 'start', width: 130 }, filter: { type: 'set' } },
      { field: 'period', title: 'Year', filter: { type: 'set' } },
      { field: 'score', title: 'Score', type: 'number', total: 'avg' },
    ],
    columnsPer: 1, chartHeight: 340,
    chartTypeModules: ['slope'],
    charts: [{ type: 'slope', x: 'period', series: 'region', y: 'score', title: 'Score, year on year' }],
  }),
}),