Apps Script-Grundlagen mit Google Sheets – Teil 5: Daten in Präsentationen in Diagrammen darstellen

1. Einführung

Willkommen zum fünften Teil der Codelab-Playlist „Grundlagen von Apps Script mit Google Sheets“. In diesem Codelab erfahren Sie, wie Sie den Tabellendienst in Apps Script verwenden, um einen Datensatz in einem Diagramm darzustellen. Außerdem erfahren Sie, wie Sie den Google Präsentationen-Dienst verwenden, um das Diagramm in eine neue Präsentation in Google Präsentationen zu exportieren.

Lerninhalte

• So erstellen Sie ein Liniendiagramm mit Apps Script.
• Diagramme in eine neue Google-Präsentation exportieren
• So werden dem Nutzer Dialogfelder in Google Tabellen präsentiert.

Hinweis: In diesem Codelab arbeiten Sie hauptsächlich mit dem Apps Script-Tabellendienst, um eingebettete Diagramme zu erstellen und zu bearbeiten.

Apps Script bietet auch einen speziellen Charts-Dienst. Es ist jedoch hauptsächlich für das Erstellen und Bearbeiten von Diagrammen für die Verwendung in Anwendungen außerhalb von Google Sheets gedacht. Diese Anwendungsfälle werden in diesem Codelab nicht behandelt.

Hinweis

Dies ist das fünfte Codelab in der Playlist „Grundlagen von Apps Script mit Google Tabellen“. Bevor Sie mit diesem Codelab beginnen, sollten Sie die vorherigen Codelabs durcharbeiten:

1. Makros und benutzerdefinierte Funktionen
2. Tabellen, Tabellenblätter und Bereiche
3. Mit Daten arbeiten
4. Datenformatierung

Voraussetzungen

• Grundkenntnisse der grundlegenden Apps Script-Themen, die in den vorherigen Codelabs dieser Playlist behandelt werden.
• Grundlegende Kenntnisse des Apps Script-Editors
• Grundlegende Kenntnisse von Google Sheets
• Kann A1-Notation in Google Sheets lesen
• Grundkenntnisse in JavaScript und der String-Klasse

2. Einrichten

Bevor Sie fortfahren, benötigen Sie eine Tabelle mit Daten. Wie bisher haben wir ein Datenblatt bereitgestellt, das Sie für diese Übungen kopieren können. Und so gehts:

1. Klicken Sie auf diesen Link, um das Datenblatt zu kopieren, und klicken Sie dann auf Kopie erstellen. Die neue Tabelle wird in Ihrem Google Drive-Ordner gespeichert und heißt „Kopie von Daten und USD-Wechselkursen“.
2. Klicken Sie auf den Tabellentitel und ändern Sie ihn von „Kopie von Datumsangaben und USD-Wechselkursen“ in „Datumsangaben und USD-Wechselkurse“. Ihre Tabelle sollte so aussehen und einige grundlegende Informationen zu verschiedenen US-Dollar-Wechselkursen zu unterschiedlichen Datumsangaben enthalten:

3. Klicken Sie auf Erweiterungen> Apps Script, um den Skripteditor zu öffnen.

Damit Sie Zeit sparen, haben wir in diese Tabelle etwas Code eingefügt, mit dem Sie ein benutzerdefiniertes Menü einrichten können. Möglicherweise wurde das Menü beim Öffnen Ihrer Kopie der Tabelle angezeigt:

Hinweis: Weitere Informationen zu benutzerdefinierten Menüs und onOpen() finden Sie im Codelab Mit Daten arbeiten.

Wichtiger Hinweis:Da die kopierte Tabelle mit einem Skriptprojekt verknüpft ist, wird das Skriptprojekt mitkopiert. Denken Sie daran, dass es sich um eine Kopie des ursprünglichen Skriptprojekts handelt. Änderungen an der Kopie werden nicht im Original berücksichtigt und umgekehrt.

Mit dieser Tabelle und diesem Projekt können Sie mit dem Codelab beginnen. Im nächsten Abschnitt erfahren Sie mehr über Diagramme und zeitgesteuerte Trigger.

3. Diagramm in Google Sheets mit Apps Script erstellen

Angenommen, Sie möchten ein bestimmtes Diagramm erstellen, um einen Datensatz zu visualisieren. Mit Apps Script können Sie Diagramme in Google Sheets erstellen, bearbeiten und einfügen. Wenn ein Diagramm in einer Tabellenkalkulation enthalten ist, wird es als eingebettetes Diagramm bezeichnet.

Diagramme werden verwendet, um eine oder mehrere Datenreihen zu visualisieren. Bei eingebetteten Diagrammen stammen die Daten, die sie präsentieren, in der Regel aus der Tabelle. Normalerweise wird das Diagramm in Google Sheets automatisch aktualisiert, wenn Sie die Daten in der Tabelle aktualisieren.

Mit Apps Script können Sie benutzerdefinierte, eingebettete Diagramme von Grund auf neu erstellen oder vorhandene Diagramme aktualisieren. In diesem Abschnitt werden die Grundlagen zum Erstellen eingebetteter Diagramme in Google Sheets mit Apps Script und dem Spreadsheet-Dienst vorgestellt.

Hinweis:Mit Apps Script können Sie zwar mehrere Aufgaben mit Diagrammen ausführen, aber einige Aktionen sind nicht möglich. Der Tabellendienst bietet mehrere EmbeddedChart-Klassen mit Diagrammfunktionen, aber sie decken nicht alle möglichen Konfigurationsoptionen ab. Apps Script verwendet auch die Google Charts API, die eigene Einschränkungen hat.

Aufgrund dieser Einschränkungen ist es oft sinnvoll, mit Apps Script einfache Diagramme zu erstellen oder die Formatierung zuerst zu bearbeiten und dann manuell in Google Tabellen anzupassen. Sie können zwar nicht jeden diagrammbezogenen Prozess in Apps Script automatisieren, aber einen Großteil davon.

Implementierung

In Ihrer Kopie der Datentabelle sind im Dataset „Dates and Exchange Rates“ (Datumsangaben und Wechselkurse) die Wechselkurse (für 1 US-Dollar) verschiedener Währungen zu unterschiedlichen Datumsangaben zu sehen. Sie implementieren eine Apps Script-Funktion, mit der ein Diagramm erstellt wird, um einen Teil dieser Daten zu visualisieren.

Und so gehts:

1. Fügen Sie im Apps Script-Editor die folgende Funktion am Ende des Code.gs-Skripts Ihres Skriptprojekts nach der Funktion onOpen() ein:

/**
 * Creates and inserts an embedded
 * line chart into the active sheet.
 */
function createEmbeddedLineChart() {
  var sheet = SpreadsheetApp.getActiveSheet();
  var chartDataRange = sheet.getRange(
    'Dates and USD Exchange Rates dataset!A2:F102');
  var hAxisOptions = {
    slantedText: true,
    slantedTextAngle: 60,
    gridlines: {
      count: 12
    }
  };
  
  var lineChartBuilder = sheet.newChart().asLineChart();
  var chart = lineChartBuilder
    .addRange(chartDataRange)
    .setPosition(5, 8, 0, 0)
    .setTitle('USD Exchange rates')
    .setNumHeaders(1)
    .setLegendPosition(Charts.Position.RIGHT)
    .setOption('hAxis', hAxisOptions)
    .setOption("useFirstColumnAsDomain", true)
    .build();
 
  sheet.insertChart(chart);  
}

2. Speichern Sie Ihr Skriptprojekt.

Code Review

Der von Ihnen hinzugefügte Code implementiert die Funktion, die vom Menüpunkt Diagramm für den Datensatz „Dates and USD Exchange Rates“ erstellen aufgerufen wird, um ein einfaches Liniendiagramm zu erstellen. Sehen wir uns den Code an.

In den ersten Zeilen werden die folgenden drei Variablen eingerichtet:

• sheet: Ein Verweis auf das aktuell aktive Tabellenblatt.
• chartDataRange: Der Zeitraum, der visualisiert werden soll. Im Code wird die A1-Notation verwendet, um den Bereich anzugeben, der die Zellen A2 bis F102 im Tabellenblatt mit dem Namen Dates and USD Exchange Rates dataset umfasst. Durch die spezifische Benennung des Tabellenblatts wird sichergestellt, dass das Menüelement auch dann funktioniert, wenn ein anderes Tabellenblatt aktiv ist, da der Bereich immer die Datenposition abdeckt. „Ab Zeile 2“ bedeutet, dass wir die Spaltenüberschriften einbeziehen und nur die 100 aktuellsten Datumsangaben (Zeilen) darstellen.
• hAxisOptions: Ein einfaches JavaScript-Objekt, das einige Einstellungsinformationen enthält, die vom Code verwendet werden, um das Erscheinungsbild der horizontalen Achse zu konfigurieren. Konkret werden die Textlabels der horizontalen Achse in einem Winkel von 60 Grad dargestellt und die Anzahl der vertikalen Rasterlinien auf 12 festgelegt.

In der nächsten Zeile wird ein Builder für Liniendiagramme-Objekt erstellt. Eingebettete Diagramme in Apps Script werden mit einem Builder-Entwurfsmuster erstellt. Eine vollständige Erklärung dieses Designmusters würde den Rahmen dieses Codelabs sprengen. Sie müssen nur wissen, dass der Spreadsheet-Dienst mehrere EmbeddedChartBuilder-Klassen bereitstellt. Um ein Diagramm zu erstellen, wird in Ihrem Code zuerst ein Builder-Objekt für eingebettete Diagramme erstellt. Anschließend werden mit den zugehörigen Methoden die Diagrammeinstellungen definiert und dann eine build()-Methode aufgerufen, um das endgültige EmbeddedChart-Objekt zu erstellen. Ihr Code ändert das EmbeddedChart-Objekt nie direkt, da die gesamte Diagrammkonfiguration über die Builder-Klassen verwaltet wird.

Der Tabellendienst bietet eine übergeordnete EmbeddedChartBuilder-Klasse und mehrere untergeordnete Builder-Klassen (z. B. EmbeddedLineChartBuilder), die von ihr erben. Mithilfe der untergeordneten Klassen kann Apps Script Methoden zur Konfiguration von Diagrammen bereitstellen, die nur für bestimmte Diagrammtypen gelten. Die Klasse EmbeddedPieChartBuilder bietet beispielsweise die Methode set3D(), die nur für Kreisdiagramme gilt.

In Ihrem Code wird mit dieser Zeile die Builder-Objektvariable lineChartBuilder erstellt:

var lineChartBuilder = sheet.newChart().asLineChart();

Im Code wird die Methode Sheet.newChart() aufgerufen, um ein EmbeddedChartBuilder-Objekt zu erstellen. Anschließend wird EmbeddedChartBuilder.asLineChart() verwendet, um den Builder-Typ auf EmbeddedLineChartBuilder festzulegen.

Anschließend wird das Diagramm mit lineChartBuilder erstellt. Dieser Teil des Codes besteht nur aus einer Reihe von Methodenaufrufen zum Definieren der Diagrammeinstellungen, gefolgt von einem build()-Aufruf zum Erstellen des Diagramms. Wie Sie in früheren Codelabs gesehen haben, wird im Code Method Chaining verwendet, um den Code lesbar zu halten. Das bewirken die Methodenaufrufe:

• addRange(range): Definiert den Datenbereich, der im Diagramm dargestellt wird.
• setPosition(anchorRowPos, anchorColPos, offsetX, offsetY): Bestimmt, wo das Diagramm im Tabellenblatt platziert wird. Hier wird die obere linke Ecke des Diagramms in die Zelle H5 eingefügt.
• setTitle(title): Hiermit wird der Diagrammtitel festgelegt.
• setNumHeaders(headers): Gibt an, wie viele Zeilen oder Spalten im Datenbereich als Überschriften behandelt werden sollen. Hier wird die erste Zeile des Datenbereichs als Kopfzeile verwendet. Das bedeutet, dass der Text in dieser Zeile als Labels für die einzelnen Datenreihen im Diagramm verwendet wird.
• setLegendPosition(position): Verschiebt die Diagrammlegende an die rechte Seite des Diagramms. Diese Methode verwendet die Enumeration Charts.Position als Parameter.
• setOption(option, value): Hiermit werden Optionen für komplexe Diagramme festgelegt. Hier wird die Option hAxis auf das Objekt hAxisOptions festgelegt. Mit dieser Methode können Sie verschiedene Optionen festlegen. Die Optionen und möglichen Werte für jeden Diagrammtyp sind in der Charts API Chart Gallery dokumentiert. Die Optionen, die Sie für Liniendiagramme festlegen können, sind beispielsweise unter Konfigurationsoptionen für Liniendiagramme dokumentiert. Die Methode setOption(option, value) ist ein fortgeschrittenes Thema. Sie sollten sie daher erst verwenden, wenn Sie sich mit dem Erstellen von Diagrammen in Apps Script besser auskennen.
• build(): Erstellt und gibt ein EmbeddedChart-Objekt mit den oben genannten Einstellungen zurück.

Schließlich wird mit dem Code Sheet.insertChart(chart) aufgerufen, um das erstellte Diagramm in das aktive Tabellenblatt einzufügen.

Ergebnisse

So können Sie Ihre Formatierungsfunktion in Aktion sehen:

1. Falls noch nicht geschehen, speichern Sie Ihr Skriptprojekt im Apps Script-Editor.
2. Klicken Sie auf das Menüelement Dataset präsentieren > Diagramm „Dataset ‚Dates and USD Exchange Rates‘“.

Hinweis:Wenn Sie ein gmail.com-Konto verwenden, wird beim ersten Ausführen des Skripts möglicherweise das Dialogfeld „Diese App ist nicht bestätigt“ angezeigt. Google verwendet diese Informationen, um Nutzer zu warnen, die möglicherweise Code von unbekannten oder nicht vertrauenswürdigen Autoren verwenden. Wenn dieses Dialogfeld angezeigt wird, können Sie fortfahren, da Sie der Autor des Skripts sind. Folgen Sie der Anleitung auf dem Bildschirm, um das Skript weiter zu autorisieren:

1. Klicken Sie im Dialogfeld für nicht bestätigte Apps auf Erweitert.
2. Klicken Sie auf Zu Datumsangaben und USD-Wechselkursen (unsicher).
3. Klicken Sie auf Zulassen.

Während dieses Codelabs werden Sie möglicherweise mehrmals aufgefordert, Berechtigungen zu erteilen. Weitere Informationen zu diesem Prozess finden Sie unter Autorisierung für Google-Dienste.

Ihr Script platziert jetzt ein neues Diagramm rechts neben Ihren Daten:

Glückwunsch! Sie haben mit Apps Script ein eingebettetes Liniendiagramm erstellt. Im nächsten Abschnitt erfahren Sie, wie Sie Ihr Diagramm in Google-Präsentationen exportieren.

4. Diagramme in Google-Präsentationen exportieren

Einer der großen Vorteile von Apps Script ist, dass Sie Daten ganz einfach von einer Google Workspace-Anwendung in eine andere übertragen können. Die meisten dieser Anwendungen haben einen dedizierten Apps Script-Dienst, ähnlich dem Tabellendienst. Gmail hat beispielsweise den Gmail-Dienst, Google Docs den Dokumentdienst und Google Präsentationen den Präsentationen-Dienst. Mit all diesen integrierten Diensten können Sie Daten aus einer Anwendung extrahieren, sie verarbeiten und das Ergebnis in eine andere Anwendung schreiben.

In diesem Abschnitt erfahren Sie, wie Sie alle eingebetteten Diagramme in einer Google-Tabelle in eine neue Google-Präsentation exportieren. Außerdem sehen Sie zwei Möglichkeiten, benutzerdefinierte Nutzernachrichten in Google Sheets anzuzeigen.

Hinweis:Wenn Sie den Slides-Dienst verwenden, können Sie mit Ihren Skripts Presentation-Objekte erstellen, sie mit Slides und Layouts füllen und dann PageElements wie Shapes, TextRanges und Lines hinzufügen. Die Anzahl der Optionen im Google-Präsentationen-Dienst ist fast so groß wie im Google-Tabellen-Dienst.

Apps Script bietet viele Möglichkeiten für Google Präsentationen. In diesem Codelab erstellen Sie eine Präsentation, erstellen Folien und importieren Diagramme in Folien. Weitere Informationen finden Sie in der Dokumentation Google-Präsentationen erweitern.

Implementierung

Hier implementieren Sie die Funktion, die über den Menüpunkt Dataset präsentieren > Diagramme in Google-Präsentationen exportieren aufgerufen wird. Und so gehts:

1. Fügen Sie im Apps Script-Editor die folgende Funktion am Ende des Code.gs-Skripts Ihres Skriptprojekts nach der Funktion createEmbeddedLineChart() ein:

/**
 * Create a Slides presentation and export
 * all the embedded charts in this spreadsheet
 * to it, one chart per slide.
 */
function exportChartsToSlides() {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  
  // Fetch a list of all embedded charts in this
  // spreadsheet.
  var charts = [];
  var sheets = ss.getSheets();
  for (var i = 0; i < sheets.length; i++) {
    charts = charts.concat(sheets[i].getCharts());
  }
  
  // If there aren't any charts, display a toast
  // message and return without doing anything
  // else.
  if (charts.length == 0) {
    ss.toast('No charts to export!');
    return;
  }
  
  // Create a Slides presentation, removing the default
  // title slide.
  var presentationTitle =
    ss.getName() + " Presentation";
  var slides = SlidesApp.create(presentationTitle);
  slides.getSlides()[0].remove();  
  
  // Add charts to the presentation, one chart per slide.
  var position = {left: 40, top: 30};
  var size = {height: 340, width: 430};
  for (var i = 0; i < charts.length; i++) {
    var newSlide = slides.appendSlide();
    newSlide.insertSheetsChart(
      charts[i],
      position.left,
      position.top,
      size.width,
      size.height);   
  }
  
  // Create and display a dialog telling the user where to
  // find the new presentation.
  var slidesUrl = slides.getUrl();
  var html = "<p>Find it in your home Drive folder:</p>"
      + "<p><a href=\"" + slidesUrl + "\" target=\"_blank\">"
      + presentationTitle + "</a></p>";
  
  SpreadsheetApp.getUi().showModalDialog(
    HtmlService.createHtmlOutput(html)
      .setHeight(120)
      .setWidth(350),
      "Created a presentation!"
  );
}

2. Speichern Sie Ihr Skriptprojekt.

Code Review

Dieser Code ist möglicherweise kürzer als erwartet. Sehen wir uns an, was der Code macht, indem wir ihn in fünf Abschnitte unterteilen:

1. Diagramme abrufen

In den ersten Zeilen wird die aktive Tabelle nach allen eingebetteten Diagrammen durchsucht und diese werden im Array charts zusammengefasst. In diesen Zeilen werden die Methoden Spreadsheet.getSheets() und Sheet.getCharts() verwendet, um Listen von Tabellenblättern und Diagrammen abzurufen. Mit der JavaScript-Methode Array.concat() wird die Liste der Diagramme aus jedem Tabellenblatt an charts angehängt.

2. Prüfen, ob Diagramme exportiert werden können

Mit dem Code wird geprüft, ob Diagramme exportiert werden sollen. Wir möchten vermeiden, dass eine leere Präsentation erstellt wird. Wenn also keine Diagramme vorhanden sind, wird mit Spreadsheet.toast(message) stattdessen eine Toast-Meldung erstellt. Das ist ein kleines Pop-up-Fenster, das rechts unten in Google Tabellen angezeigt wird, einige Sekunden lang eingeblendet bleibt und dann wieder verschwindet:

Wichtig:Mit Kurzinfos können Sie dem Nutzer mitteilen, dass etwas passiert ist, ohne dass er darauf reagieren muss. In diesem Fall wird dem Nutzer in der Kurzmitteilung mitgeteilt, dass die Menüaktion erfolgreich abgeschlossen wurde, aber keine Ergebnisse erzielt wurden, da keine Diagramme zum Exportieren vorhanden sind.

Wenn durch den Code keine Kurzinfo erstellt wird, sieht es so aus, als würde das Menüelement überhaupt nichts bewirken, und der Nutzer könnte denken, dass das Skript nicht funktioniert. Es hat sich bewährt, Nutzer darüber zu informieren, was Ihre Skripts tun, auch wenn Fehler auftreten.

Wenn keine Diagramme exportiert werden sollen, wird die Toast-Meldung erstellt und das Programm wird beendet, ohne dass weitere Aktionen ausgeführt werden. Wenn Diagramme exportiert werden sollen, wird in den nächsten Zeilen eine Präsentation erstellt.

3. Präsentation erstellen

Die Variable presentationTitle wird erstellt, um den Dateinamen der neuen Präsentation zu speichern. Er wird als Name der Tabelle festgelegt, wobei „ Presentation“ am Ende angehängt wird. Der Code ruft dann die Slides-Dienstmethode SlidesApp.create(name) auf, um eine Präsentation zu erstellen.

Hinweis:Die Klasse SlidesApp fungiert als übergeordnete Klasse für den Slides-Dienst, ähnlich wie SpreadsheetApp die übergeordnete Klasse für den Tabellendienst ist.

Neue Präsentationen werden mit einer einzelnen leeren Folie erstellt. Das möchten wir in unserer Präsentation nicht, daher wird es mit Presentation.getSlides() und Slide.remove() entfernt.

4. Diagramme exportieren

Im nächsten Abschnitt wird der position und size der JavaScript-Objekte definiert, um festzulegen, wo die importierten Diagramme auf der Folie platziert werden und wie groß sie sein sollen (in Pixeln).

Hinweis:Für Folienseitenelemente wie importierte Diagramme, Textfelder und Formen sind bestimmte Positionen und Größen erforderlich. Weitere Informationen dazu, wie diese Werte in Apps Script festgelegt werden, finden Sie im Leitfaden Größe und Position von Seitenelementen festlegen.

Der Code durchläuft jedes Diagramm in der Liste „charts“. Für jedes Diagramm wird ein newSlide mit Presentation.appendSlide() erstellt und die Folie wird am Ende der Präsentation hinzugefügt. Mit der Methode Slide.insertSheetsChart(sourceChart, left, top, width, height) wird das Diagramm in die Folie mit den angegebenen position und size importiert.

5. Ort der Präsentation teilen

Schließlich muss der Code dem Nutzer mitteilen, wo sich die neue Präsentation befindet, vorzugsweise mit einem Link, auf den er klicken kann, um sie zu öffnen. Dazu wird mit dem HTML-Dienst von Apps Script ein benutzerdefiniertes modales Dialogfeld erstellt. Modale Dialogfelder (in Apps Script auch als benutzerdefinierte Dialogfelder bezeichnet) sind Fenster, die über der Google Sheets-Benutzeroberfläche angezeigt werden. Wenn benutzerdefinierte Dialogfelder angezeigt werden, kann der Nutzer nicht mit Google Tabellen interagieren.

Wichtiger Hinweis:Modale Dialogfelder eignen sich gut, wenn Ihr Skript bestimmte Eingaben vom Nutzer benötigt, um fortzufahren, oder wenn Sie sicherstellen möchten, dass der Nutzer etwas sieht, bevor er in Google Tabellen weiterarbeitet.

Mit dem HTML-Service von Apps Script können Sie das Design und den Inhalt benutzerdefinierter Dialogfelder mit Standard-HTML und JavaScript vollständig steuern. Sie können dem Dialogfeld also Text, Schaltflächen, Bilder und andere interaktive Elemente hinzufügen. Diese Themen werden in diesem Codelab nicht behandelt. Wenn Sie mehr erfahren möchten, können Sie sich die Anleitungen HTML erstellen und bereitstellen und Server-Client-Kommunikation ansehen.

Zum Erstellen eines benutzerdefinierten Dialogfelds benötigt der Code das HTML, das seinen Inhalt definiert. Diese wird in der Variablen html bereitgestellt. Der Inhalt umfasst einen kurzen Absatz und einen Hyperlink. Der Hyperlink ist die Variable presentationTitle, die mit der von Presentation.getUrl() bereitgestellten Präsentations-URL verknüpft ist. Der Hyperlink verwendet auch das Attribut target="_blank", sodass die Präsentation in einem neuen Browsertab und nicht im Dialogfeld geöffnet wird.

Das HTML wird mit der Methode HtmlService.createHtmlOutput(html) in ein HtmlOutput-Objekt geparst. Mit dem HtmlOutput-Objekt kann die Größe des benutzerdefinierten Dialogfelds mit HtmlOutput.setHeight(height) und HtmlOutput.setWidth(width) festgelegt werden.

Nachdem htmlOutput erstellt wurde, wird mit der Methode Ui.showModalDialog(htmlOutput, title) das Dialogfeld mit dem angegebenen Titel angezeigt.

Ergebnisse

Nachdem Sie das zweite Menüelement implementiert haben, können Sie es in Aktion sehen. So testen Sie die Funktion exportChartsToSlides():

1. Falls noch nicht geschehen, speichern Sie Ihr Skriptprojekt im Apps Script-Editor.
2. Öffnen Sie die Tabelle und klicken Sie auf das Menüelement Dataset präsentieren > Diagramm „Dataset ‚Dates and USD Exchange Rates‘“, um ein Diagramm zum Exportieren zu erstellen. Es wird in Zelle H5 des aktiven Blatts verankert.
3. Klicken Sie auf das Menüelement Dataset präsentieren > Diagramme in Google-Präsentationen exportieren. Möglicherweise werden Sie aufgefordert, das Skript noch einmal zu autorisieren.
4. Das Skript sollte die Anfrage verarbeiten und das benutzerdefinierte Dialogfeld anzeigen.
5. Klicken Sie auf den Link Dates and USD Exchange Rates Presentation (Präsentation zu Datumsangaben und USD-Wechselkursen), um die neue Google-Präsentation zu öffnen:

Sie können auch weitere Diagramme in Ihre Tabelle einfügen und das Menüelement noch einmal auswählen, um eine Präsentation mit mehreren Folien zu erstellen.

Hinweis:Die in der Präsentation enthaltenen Diagramme sind verknüpfte Diagramme. Das bedeutet, dass sie weiterhin mit dem Originaldiagramm in Google Sheets verknüpft sind. Wenn Sie das ursprüngliche Sheets-Diagramm bearbeiten, können Sie das verknüpfte Diagramm in Präsentationen über die Schaltfläche Aktualisieren im Diagramm aktualisieren. Sie können auch ein Aktualisieren erzwingen, indem Sie die Methode SheetCharts.refresh() verwenden.

Sie können jetzt in Google Sheets erstellte Diagramme in eine Google-Präsentation exportieren. Sie können auch Code schreiben, um ein benutzerdefiniertes Dialogfeld zu erstellen.

Sie haben die letzte Übung dieses Codelabs abgeschlossen. Im nächsten Abschnitt können Sie Ihr Wissen überprüfen.

5. Fazit

Herzlichen Glückwunsch! Sie haben dieses Codelab und die gesamte Codelab-Playlist „Grundlagen von Apps Script mit Google Tabellen“ abgeschlossen. Mithilfe der in dieser Playlist vermittelten Grundlagen können Sie Ihre Kenntnisse in Google Tabellen erweitern und die Funktionen von Apps Script kennenlernen.

War dieses Codelab hilfreich?

Ja Nein

Das haben Sie gelernt

• Eingebettetes Liniendiagramm mit Apps Script erstellen
• So präsentieren Sie einem Nutzer in Google Tabellen Infofelder und benutzerdefinierte Dialogfelder.
• Diagramm in eine neue Google-Präsentation exportieren

Wichtige Konzepte:

1. Der Tabellendienst verwendet EmbeddedChart und die zugehörigen Builder-Klassen, um Diagramme in Google Sheets zu erstellen und zu ändern. Der Charts-Dienst wird zum Erstellen und Ändern von Diagrammen verwendet, die außerhalb von Google Sheets verwendet werden, z. B. in Apps Script-Webanwendungen.
2. Toast-Nachrichten werden in Google Tabellen verwendet, um dem Nutzer eine kurze Benachrichtigung zu präsentieren, ohne dass er darauf reagieren muss.
3. Benutzerdefinierte Dialogfelder sind modale Dialogfelder, die mit HTML und JavaScript erstellt werden. Wenn benutzerdefinierte Dialogfelder angezeigt werden, kann der Nutzer nicht mit Google Tabellen interagieren. Benutzerdefinierte Dialogfelder eignen sich hervorragend, um den Nutzer aufzufordern, Informationen einzugeben, die für die Ausführung des Skripts erforderlich sind, oder um den Nutzer zu bitten, etwas zu lesen, bevor er in Google Tabellen weiterarbeitet.
4. Wenn eine Datei mit einem containergebundenen Skript kopiert wird, enthält die Kopie der Datei eine Kopie des gebundenen Skripts. Wenn Sie die Kopie ändern, wird das nicht im Original berücksichtigt und umgekehrt.
5. Verknüpfte Diagramme in Google-Präsentationen sind mit dem Originaldiagramm in Google-Tabellen verknüpft. Wenn Sie das ursprüngliche Google-Tabellen-Diagramm bearbeiten, können Sie das verknüpfte Diagramm in Google-Präsentationen aktualisieren, damit die Änderungen übernommen werden.

Wichtige Begriffe:

• Aktiv (Status): Gibt an, dass die angegebene Tabelle, das angegebene Tabellenblatt, der angegebene Bereich oder die angegebene Zelle derzeit vom Nutzer der Tabelle aufgerufen oder markiert wird.
• Aktive Zelle: Die einzelne hervorgehobene Zelle im aktiven Tabellenblatt, auf die der Cursor fokussiert ist.
• Aktiver Bereich: Eine Gruppe von einer oder mehreren Zellen, die derzeit im aktiven Tabellenblatt hervorgehoben sind.
• Autorisierung: Der Prozess, bei dem der Nutzer Berechtigungen erteilt, damit Apps Script auf Nutzerdaten in den relevanten Google-Diensten zugreifen oder anderweitig Aktionen im Namen des Nutzers ausführen kann.
• An Container gebundenes Skript: Ein Skript, das an ein Google Workspace-Dokument wie eine Google-Tabelle oder ein Google-Dokument gebunden ist und daraus erstellt wurde.
• Benutzerdefinierter Dialog: Ein anpassbares modales Dialogfenster, das aus HTML und JavaScript erstellt wurde und mit dem Nutzer Informationen oder Interaktivität erhalten. Wenn benutzerdefinierte Dialogfelder angezeigt werden, kann der Nutzer nicht mit Google Tabellen interagieren.
• EmbeddedChart: Ein Diagramm, das in eine Tabelle eingebettet wurde.
• EmbeddedChartBuilder: Eine Klasse oder ein Builder zum Erstellen oder Bearbeiten eines EmbeddedChart.
• Hilfsfunktion: Eine Funktion, in der Regel privat, die von einer anderen Funktion aufgerufen wird, um eine kleine Teilaufgabe auszuführen. Hilfsfunktionen werden verwendet, wenn die untergeordnete Aufgabe mehrmals an verschiedenen Stellen ausgeführt werden muss.
• JSON: Dateiformat zum Definieren von Datenobjekten und ihren Eigenschaften aus Text.
• onOpen(): Wenn dieser Trigger in einem Skript definiert ist, wird er immer dann ausgelöst, wenn eine Datei geöffnet oder neu geladen wird.
• Verknüpftes Diagramm: Ein Diagramm in Google Präsentationen, das mit einem Originaldiagramm in Google Tabellen verknüpft ist. Wenn Sie das ursprüngliche Google-Tabellen-Diagramm bearbeiten, können Sie das verknüpfte Diagramm in Google-Präsentationen aktualisieren, damit die Änderungen übernommen werden.
• Modales Dialogfeld: Gehen Sie zu benutzerdefiniertem Dialogfeld.
• Präsentation: Eine Google-Präsentationen-Datei in Google Drive. Mit der Klasse Presentation können Sie auf Präsentationen zugreifen und sie ändern.
• Bereich: Eine Gruppe aus einer oder mehreren angrenzenden Zellen in einem Tabellenblatt. Mit der Klasse Range** können Sie Bereiche in einem Tabellenblatt lesen und aktualisieren.
• Script-Editor: Der In-Browser-Code-Editor für Apps Script.
• Einfache Trigger: Ein Untertyp von Triggern in Apps Script mit reservierten Namen für Triggerfunktionen und bestimmten Einschränkungen.
• Arbeitsblatt**: Eine einzelne Seite einer Tabelle. Wird manchmal verwendet, um auf eine Google-Tabellen-Datei in Google Drive zu verweisen. Mit der Klasse Sheet** können Sie auf Tabellen zugreifen und sie ändern.
• Folie: Eine einzelne Folie in einer Präsentation. Mit der Klasse Slide können Sie auf Folien zugreifen und sie ändern.
• SlidesApp: Diese Klasse dient als übergeordnete Klasse für den Slides-Dienst und bietet einen Ausgangspunkt für Code, mit dem Google-Präsentationen-Daten gelesen oder bearbeitet werden.
• SpreadsheetApp: Diese Klasse dient als übergeordnete Klasse für den Tabellendienst und bietet einen Ausgangspunkt für Code, mit dem Google Sheets-Daten gelesen oder bearbeitet werden.
• Tabelle**: Eine Google Sheets-Datei, die sich in Google Drive befindet. Mit der Klasse Spreadsheet** können Sie auf Tabellen zugreifen und sie ändern.
• Google Sheets: Ein Apps Script-Dienst, mit dem Skripts Google Sheets-Dateien erstellen, darauf zugreifen und sie ändern können.
• Benachrichtigung: Ein kurzlebiges Dialogfeld, das Nutzer über ein Ereignis oder einen Prozess in Google Tabellen informiert.
• Trigger: Ein Ereignis, das an eine Apps Script-Funktion gebunden ist. Wenn das Ereignis (z. B. das Öffnen einer Tabelle) eintritt, wird der Trigger ausgelöst und die zugehörige Apps Script-Funktion wird automatisch ausgeführt.
• URL-Abrufdienst: Der Apps Script-Dienst, mit dem Skripts eine Verbindung zu URL-Endpunkten herstellen können, um Anfragen zu senden und Antworten zu empfangen.

Nächste Schritte

Du hast diese Playlist erfolgreich abgeschlossen. Es gibt jedoch noch viel mehr über Apps Script zu lernen.

Dann sehen Sie sich gleich diese Infomaterialien an:

• Apps Script-Entwicklerdokumentation
• Apps Script-Anleitungen
• Apps Script-Referenzdokumentation
• Apps Script-Fragen bei Stack Overflow
• Apps Script-Codebeispiele auf GitHub

Viel Spaß beim Erstellen von Skripten!

War diese Codelab-Playlist hilfreich?

Ja Nein

Möchten Sie in Zukunft weitere Apps Script-Codelabs sehen?

Ja Nein