Develop with Looker Studio Community Connectors and Visualizations

Key Concepts:

• Looker Studio Community Connectors: AppScript-based applications to connect any internet-accessible data source to Looker Studio.
• Looker Studio Community Visualizations: Custom-built JavaScript visualizations to display data within Looker Studio reports.
• AppScript: A scripting language similar to JavaScript, used for building connectors.
• Manifest file (appscript.json, manifest.json): JSON files containing metadata and configuration details for connectors and visualizations.
• Data Source Schema: The structure and data types of the data that the connector provides to Looker Studio.
• DSCC (Looker Studio Community Component Library): A helper library for visualizations to interface with Looker Studio.
• GCS (Google Cloud Storage): Used to host the files required for community visualizations.

Looker Studio Community Connectors

• Definition: Community connectors are AppScript-based applications that bridge the gap between external data sources and Looker Studio. They enable users to import data from various sources into Looker Studio for analysis and visualization.
• Use Cases:
  • Connecting to commercial platforms (e.g., Google Analytics, social media).
  • Accessing on-premise enterprise data sources (if accessible via the internet).
  • Integrating with custom services.
  • Fetching data from public web sources.
• Building a Connector:
  1. AppScript Project: Create an AppScript project with at least two files: appscript.json (manifest) and code.gs (code).
  2. Manifest (appscript.json): Contains metadata like name, description, and other properties.
  3. Code (code.gs): Must define four essential methods:
     • getAuthType(): Defines the authentication mechanism (e.g., user/pass). If using user/pass, set the O type to user pass.
     • getConfig(): Determines the configuration options presented to the user during connector installation (e.g., a text field for a table name).
     • getSchema(): Defines the data source schema, specifying fields (dimensions and metrics) and their data types.
     • getData(): Fetches data from the source based on the request object from Looker Studio, which includes requested fields, filters, and configuration parameters. The data must be transformed to match the defined schema.
• Example: A connector that requires a username and password for access. The getAuthType() method would be set to "user pass". The getConfig() method might present a text field for the user to input the name of a table. The getSchema() method would define a text dimension and some aggregation metric.
• Deployment and Testing: Use the AppScript development environment to deploy and test the connector in a Looker Studio report.
• Publishing: Consider publishing the connector to the Looker Studio connector gallery to increase visibility and encourage usage. Ensure the manifest properties meet the publishing guidelines.

Looker Studio Community Visualizations

• Definition: Community visualizations are custom JavaScript-based components that allow users to create unique and tailored data visualizations within Looker Studio reports.
• Requirements:
  • Google Cloud Storage (GCS) bucket to host the visualization files.
  • Required files: manifest.json, config JSON, JavaScript file (.js), and optional CSS file.
• File Breakdown:
  1. manifest.json: Contains metadata about the visualization, including name, description, and the components property. The components property is an array of component objects, each representing a visualization. Each component object contains properties like name and description, and the crucial resource property, which points to the locations of the JavaScript, config JSON, and CSS files.
  2. Config JSON: Defines the data fields supported by the visualization (e.g., one dimension and one metric) and the style options available to the user (e.g., a fill color option).
  3. JavaScript (.js): Contains the visualization's business logic. It must import the Looker Studio Community Component Library (DSCC) to interface with Looker Studio. The visualization should use DSCC.subscribeToData() to register a callback function that is called whenever data or style changes occur. The callback function updates the visualization accordingly. DSCC also provides helper functions like getHeight().
  4. CSS (optional): Used to style the visualization.
• Example: A visualization that supports one dimension and one metric, with a style option for setting the fill color.
• Testing: Test the visualization in a Looker Studio report by pointing Looker Studio to the manifest file in the GCS bucket.
• Publishing: Publish the visualization to the Looker Studio gallery to increase visibility and help the community. Adhere to the publishing guidelines.

Synthesis/Conclusion:

Looker Studio community connectors and visualizations empower users to extend the capabilities of Looker Studio by connecting to diverse data sources and creating custom visualizations. Connectors use AppScript to define data schemas and fetch data, while visualizations use JavaScript and the DSCC library to render data in unique ways. Publishing these creations to the Looker Studio gallery allows others to benefit from them, fostering a collaborative ecosystem. The video encourages viewers to try the provided collabs and consider submitting their own connectors and visualizations to the public galleries.