google_analystic_charts 0.0.1

Plugin Flutter para exibir Google Charts (gráficos do Google) em Android, iOS, macOS e Web, ideal para dados do Google Analytics (GA4) vindos do seu backend.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:google_analystic_charts/google_analystic_charts.dart';

void main() => runApp(const DemoApp());

class DemoApp extends StatelessWidget {
  const DemoApp({super.key});

  @override
  Widget build(BuildContext context) {
    final data = <List<Object?>>[
      ['Dia', 'Usuários'],
      ['Seg', 1200],
      ['Ter', 1350],
      ['Qua', 1280],
      ['Qui', 1600],
      ['Sex', 1900],
      ['Sáb', 900],
      ['Dom', 700],
    ];

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('Google Analytics Charts - Demo')),
        body: Padding(
          padding: const EdgeInsets.all(16),
          child: Column(
            children: [
              Expanded(
                child: Card(
                  clipBehavior: Clip.antiAlias,
                  child: GaChart(
                    type: GaChartType.line,
                    data: data,
                    options: const {
                      'legend': {'position': 'bottom'},
                      'curveType': 'function',
                    },
                    backgroundColor: Colors.white,
                    borderRadius: const BorderRadius.all(Radius.circular(8)),
                  ),
                ),
              ),
              const SizedBox(height: 12),
              Expanded(
                child: Card(
                  clipBehavior: Clip.antiAlias,
                  child: GaChart(
                    type: GaChartType.pie,
                    data: const [
                      ['Canal', 'Usuários'],
                      ['Orgânico', 3200],
                      ['Direto', 2100],
                      ['Social', 900],
                      ['Pago', 700],
                    ],
                    options: const {
                      'legend': {'position': 'right'},
                    },
                    backgroundColor: Colors.white,
                    borderRadius: const BorderRadius.all(Radius.circular(8)),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}