Introduction

import {
  createSpec,
  pipe,
  geom,
  scale,
  styles,
  style,
  config,
} from '@graphysdk/react';

const spec = pipe(
  createSpec({ x: 'month', y: 'revenue', color: 'product' }), // mapping — columns → aesthetics
  geom.line(), // geom   — the shape to draw
  scale.x(), // scale  — values → positions
  scale.y(),
  scale.color.discrete(), // scale  — groups → colors
  styles({ defaults: [style.geom.line({ strokeWidth: 3 })] }), // styles — how the geoms are painted
  config({ legend: { position: 'bottom' } }) // config — chart chrome
);