lineChart static method

String lineChart({ required List<double> values, double width = 400, double height = 250, String color = '#2196F3', bool filled = false, String title = '', })

Generate a line chart SVG.

Implementation

static String lineChart({
  required List<double> values,
  double width = 400,
  double height = 250,
  String color = '#2196F3',
  bool filled = false,
  String title = '',
}) {
  if (values.isEmpty) return _emptySvg(width, height);
  const padLeft = 40.0, padBottom = 20.0, padTop = 30.0, padRight = 10.0;
  final chartW = width - padLeft - padRight;
  final chartH = height - padTop - padBottom;

  final minV = values.reduce((a, b) => a < b ? a : b);
  final maxV = values.reduce((a, b) => a > b ? a : b);
  final range = (maxV - minV).abs().clamp(1.0, double.infinity);

  Offset toCanvas(int i) {
    final x = padLeft + (i / (values.length - 1)) * chartW;
    final y = padTop + chartH - ((values[i] - minV) / range) * chartH;
    return Offset(x, y);
  }

  final pts = List.generate(values.length, (i) => toCanvas(i));
  final d = pts
      .asMap()
      .entries
      .map(
        (e) =>
            '${e.key == 0 ? 'M' : 'L'}${e.value.dx.toStringAsFixed(1)},${e.value.dy.toStringAsFixed(1)}',
      )
      .join(' ');

  final buf = StringBuffer();
  buf.writeln(
    '<svg xmlns="http://www.w3.org/2000/svg" width="$width" height="$height">',
  );
  if (title.isNotEmpty) {
    buf.writeln(
      '<text x="${width / 2}" y="16" text-anchor="middle" font-size="14" '
      'font-weight="bold" fill="#1a1a1a">$title</text>',
    );
  }
  if (filled) {
    final first = pts.first;
    final last = pts.last;
    final fillD =
        '$d L${last.dx.toStringAsFixed(1)},${(padTop + chartH).toStringAsFixed(1)} '
        'L${first.dx.toStringAsFixed(1)},${(padTop + chartH).toStringAsFixed(1)} Z';
    buf.writeln(
      '<path d="$fillD" fill="$color" fill-opacity="0.15" stroke="none"/>',
    );
  }
  buf.writeln(
    '<path d="$d" stroke="$color" stroke-width="2" fill="none" stroke-linejoin="round"/>',
  );
  buf.writeln('</svg>');
  return buf.toString();
}