Grafieken aanmaken met Apps Script

Grafieken in Apps Script

Apps Script biedt een volledige API voor het aanmaken en beheren van grafieken in Google Sheets. Via de EmbeddedChartBuilder configureer je het grafiektype, de databereiken, titels, kleuren en positie. Je start altijd met blad.newChart(), kettingt de instellingen aaneen en sluit af met build().

function maakLijngrafiek() {
  const blad = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();

  const grafiek = blad.newChart()
    .setChartType(Charts.ChartType.LINE)
    .addRange(blad.getRange('A1:B20'))
    .setPosition(5, 5, 0, 0)
    .setOption('title', 'Omzet per maand')
    .setOption('hAxis.title', 'Maand')
    .setOption('vAxis.title', 'Omzet (EUR)')
    .setOption('width', 600)
    .setOption('height', 400)
    .build();

  blad.insertChart(grafiek);
}

De eerste rij van je bereik wordt standaard als kopregel gebruikt: kolom A levert de labels, de overige kolommen de meetwaarden.

Staaf- en taartgrafieken

function maakStaafgrafiek() {
  const blad = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();

  const grafiek = blad.newChart()
    .setChartType(Charts.ChartType.BAR)
    .addRange(blad.getRange('A1:C10'))
    .setPosition(20, 1, 0, 0)
    .setOption('title', 'Scores per afdeling')
    .setOption('isStacked', true)
    .setOption('colors', ['#1A73E8', '#34A853', '#FBBC04'])
    .setOption('legend.position', 'bottom')
    .build();

  blad.insertChart(grafiek);
}

function maakTaartgrafiek() {
  const blad = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();

  const grafiek = blad.newChart()
    .setChartType(Charts.ChartType.PIE)
    .addRange(blad.getRange('A1:B5'))
    .setPosition(2, 8, 0, 0)
    .setOption('title', 'Marktverdeling')
    .setOption('pieHole', 0.4)
    .setOption('width', 500)
    .setOption('height', 400)
    .build();

  blad.insertChart(grafiek);
}

De optie pieHole met een waarde tussen 0 en 1 maakt van een taartgrafiek een donutgrafiek.

Bestaande grafieken bijwerken

Een bestaande grafiek pas je aan met modify(), dat een nieuwe builder teruggeeft. De wijziging is pas definitief na updateChart().

function wijzigGrafiek() {
  const blad = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const grafieken = blad.getCharts();

  if (grafieken.length === 0) {
    Logger.log('Geen grafieken gevonden');
    return;
  }

  const builder = grafieken[0].modify()
    .setOption('title', 'Bijgewerkte titel')
    .clearRanges()
    .addRange(blad.getRange('A1:B30'));

  blad.updateChart(builder.build());
}

Grafieken verwijderen

function verwijderAlleGrafieken() {
  const blad = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const grafieken = blad.getCharts();
  grafieken.forEach(g => blad.removeChart(g));
  Logger.log(`${grafieken.length} grafieken verwijderd`);
}

Grafiek als afbeelding exporteren

Met getAs('image/png') zet je een grafiek om in een blob. Die kun je opslaan in Drive of als bijlage versturen.

function exporteerGrafiekAlsAfbeelding() {
  const blad = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const grafieken = blad.getCharts();

  if (grafieken.length === 0) return;

  const grafiek = grafieken[0];
  const blob = grafiek.getAs('image/png');
  blob.setName('grafiek.png');

  DriveApp.getFolderById('MAP_ID').createFile(blob);

  GmailApp.sendEmail('manager@bedrijf.nl', 'Grafiek bijgevoegd', 'Zie bijlage', {
    attachments: [blob],
  });
}

Dynamische dashboard-grafieken

Bij een dashboard wil je de grafieken telkens opnieuw opbouwen op basis van de actuele data. Verwijder eerst de oude grafieken en bepaal het bereik op basis van getLastRow().

function vernieuwDashboard() {
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const dataBlad = ss.getSheetByName('Data');
  const dashBlad = ss.getSheetByName('Dashboard');

  dashBlad.getCharts().forEach(g => dashBlad.removeChart(g));

  const aantalRijen = dataBlad.getLastRow();

  const omzetGrafiek = dashBlad.newChart()
    .setChartType(Charts.ChartType.COLUMN)
    .addRange(dataBlad.getRange(1, 1, aantalRijen, 2))
    .setPosition(1, 1, 0, 0)
    .setOption('title', `Omzet (${aantalRijen - 1} maanden)`)
    .setOption('width', 800)
    .setOption('height', 300)
    .build();

  dashBlad.insertChart(omzetGrafiek);
}

Wekelijks een rapportagegrafiek mailen

Grafieken maken rapporten visueel aantrekkelijk en inzichtelijk. Door de generatie te automatiseren houd je je visualisaties altijd actueel zonder handmatig werk.