CINXE.COM
Looker Studio Community Visualizations | Google for Developers
<!doctype html> <html lang="en" dir="ltr"> <head> <meta name="google-signin-client-id" content="721724668570-nbkv1cfusk7kk4eni4pjvepaus73b13t.apps.googleusercontent.com"> <meta name="google-signin-scope" content="profile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award"> <meta property="og:site_name" content="Google for Developers"> <meta property="og:type" content="website"><meta name="theme-color" content="#1a73e8"><meta charset="utf-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="manifest" href="/_pwa/developers/manifest.json" crossorigin="use-credentials"> <link rel="preconnect" href="//www.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.googleapis.com" crossorigin> <link rel="preconnect" href="//apis.google.com" crossorigin> <link rel="preconnect" href="//www.google-analytics.com" crossorigin><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"> <link rel="stylesheet" href="//fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined&display=block"><link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/css/app.css"> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/favicon-new.png"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/touchicon-180-new.png"><link rel="canonical" href="https://developers.google.com/looker-studio/visualization"><link rel="search" type="application/opensearchdescription+xml" title="Google for Developers" href="https://developers.google.com/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://developers.google.com/looker-studio/visualization" /><link rel="alternate" hreflang="x-default" href="https://developers.google.com/looker-studio/visualization" /><link rel="alternate" hreflang="ar" href="https://developers.google.com/looker-studio/visualization?hl=ar" /><link rel="alternate" hreflang="bn" href="https://developers.google.com/looker-studio/visualization?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://developers.google.com/looker-studio/visualization?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://developers.google.com/looker-studio/visualization?hl=zh-tw" /><link rel="alternate" hreflang="fa" href="https://developers.google.com/looker-studio/visualization?hl=fa" /><link rel="alternate" hreflang="fr" href="https://developers.google.com/looker-studio/visualization?hl=fr" /><link rel="alternate" hreflang="de" href="https://developers.google.com/looker-studio/visualization?hl=de" /><link rel="alternate" hreflang="he" href="https://developers.google.com/looker-studio/visualization?hl=he" /><link rel="alternate" hreflang="hi" href="https://developers.google.com/looker-studio/visualization?hl=hi" /><link rel="alternate" hreflang="id" href="https://developers.google.com/looker-studio/visualization?hl=id" /><link rel="alternate" hreflang="it" href="https://developers.google.com/looker-studio/visualization?hl=it" /><link rel="alternate" hreflang="ja" href="https://developers.google.com/looker-studio/visualization?hl=ja" /><link rel="alternate" hreflang="ko" href="https://developers.google.com/looker-studio/visualization?hl=ko" /><link rel="alternate" hreflang="pl" href="https://developers.google.com/looker-studio/visualization?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://developers.google.com/looker-studio/visualization?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://developers.google.com/looker-studio/visualization?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://developers.google.com/looker-studio/visualization?hl=es-419" /><link rel="alternate" hreflang="th" href="https://developers.google.com/looker-studio/visualization?hl=th" /><link rel="alternate" hreflang="tr" href="https://developers.google.com/looker-studio/visualization?hl=tr" /><link rel="alternate" hreflang="vi" href="https://developers.google.com/looker-studio/visualization?hl=vi" /><title>Looker Studio Community Visualizations | Google for Developers</title> <meta property="og:title" content="Looker Studio Community Visualizations | Google for Developers"><meta name="description" content="Bring the power of any visualization to your data"> <meta property="og:description" content="Bring the power of any visualization to your data"><meta property="og:url" content="https://developers.google.com/looker-studio/visualization"><meta property="og:image" content="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/opengraph/google-blue.png"> <meta property="og:image:width" content="1200"> <meta property="og:image:height" content="675"><meta property="og:locale" content="en"><meta name="twitter:card" content="summary_large_image"><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "headline": "Looker Studio Community Visualizations" } </script><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Looker Studio", "item": "https://developers.google.com/looker-studio" },{ "@type": "ListItem", "position": 2, "name": "Community Visualizations", "item": "https://developers.google.com/looker-studio/visualization" }] } </script> <link rel="stylesheet" href="/extras.css"></head> <body class="" template="page" theme="google-blue" type="article" layout="docs" concierge='closed' display-toc pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <section class="devsite-wrapper"> <devsite-cookie-notification-bar></devsite-cookie-notification-bar><devsite-header role="banner"> <div class="devsite-header--inner nocontent"> <div class="devsite-top-logo-row-wrapper-wrapper"> <div class="devsite-top-logo-row-wrapper"> <div class="devsite-top-logo-row"> <button type="button" id="devsite-hamburger-menu" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Navigation menu button" visually-hidden aria-label="Open menu"> </button> <div class="devsite-product-name-wrapper"> <a href="https://developers.google.com/looker-studio"> <div class="devsite-product-logo-container" size="medium" > <picture> <img class="devsite-product-logo" alt="Looker Studio" src="https://www.gstatic.com/analytics-lego/svg/ic_looker_studio.svg" srcset=" https://www.gstatic.com/analytics-lego/svg/ic_looker_studio.svg" sizes="64px" loading="lazy" > </picture> </div> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> <a href="https://developers.google.com/looker-studio" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Looker Studio" > Looker Studio </a> </li> </ul> </span> </div> <div class="devsite-top-logo-row-middle"> <div class="devsite-header-upper-tabs"> <devsite-tabs class="upper-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Upper tabs"> <tab > <a href="https://developers.google.com/looker-studio/connector" track-metadata-eventdetail="https://developers.google.com/looker-studio/connector" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - connect" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Connect" track-name="connect" > Connect </a> </tab> <tab class="devsite-active"> <a href="https://developers.google.com/looker-studio/visualization" track-metadata-eventdetail="https://developers.google.com/looker-studio/visualization" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - visualize" track-metadata-module="primary nav" aria-label="Visualize, selected" data-category="Site-Wide Custom Events" data-label="Tab: Visualize" track-name="visualize" > Visualize </a> </tab> <tab class="devsite-dropdown "> <a href="https://developers.google.com/looker-studio/integrate" track-metadata-eventdetail="https://developers.google.com/looker-studio/integrate" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - integrate" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Integrate" track-name="integrate" > Integrate </a> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for Integrate" track-type="nav" track-metadata-eventdetail="https://developers.google.com/looker-studio/integrate" track-metadata-position="nav - integrate" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Integrate" track-name="integrate" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Integrate</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/looker-studio/integrate/linking-api" track-type="nav" track-metadata-eventdetail="https://developers.google.com/looker-studio/integrate/linking-api" track-metadata-position="nav - integrate" track-metadata-module="tertiary nav" track-metadata-module_headline="integrate" tooltip > <div class="devsite-nav-item-title"> Linking API </div> <div class="devsite-nav-item-description"> Pre-configure reports for customers. </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/looker-studio/integrate/api" track-type="nav" track-metadata-eventdetail="https://developers.google.com/looker-studio/integrate/api" track-metadata-position="nav - integrate" track-metadata-module="tertiary nav" track-metadata-module_headline="integrate" tooltip > <div class="devsite-nav-item-title"> Looker Studio API </div> <div class="devsite-nav-item-description"> Find and manage Looker Studio assets. </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Share</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/looker-studio/integrate" track-type="nav" track-metadata-eventdetail="https://developers.google.com/looker-studio/integrate" track-metadata-position="nav - integrate" track-metadata-module="tertiary nav" track-metadata-module_headline="share" tooltip > <div class="devsite-nav-item-title"> Publish a connector, visualization or report </div> <div class="devsite-nav-item-description"> Distribute your work to Looker users. </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/looker-studio/integrate/embed" track-type="nav" track-metadata-eventdetail="https://developers.google.com/looker-studio/integrate/embed" track-metadata-position="nav - integrate" track-metadata-module="tertiary nav" track-metadata-module_headline="share" tooltip > <div class="devsite-nav-item-title"> Embed and snippets </div> <div class="devsite-nav-item-description"> Share insights with the world. </div> </a> </li> </ul> </div> </div> </div> </tab> <tab > <a href="https://developers.google.com/looker-studio/support" track-metadata-eventdetail="https://developers.google.com/looker-studio/support" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - support" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support" > Support </a> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Community Visualizations" tenant-name="Google for Developers" project-scope="/looker-studio/visualization" url-scoped="https://developers.google.com/s/results/looker-studio/visualization" > <form class="devsite-search-form" action="https://developers.google.com/s/results" method="GET"> <div class="devsite-search-container"> <button type="button" search-open class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Open search"></button> <div class="devsite-searchbox"> <input aria-activedescendant="" aria-autocomplete="list" aria-label="Search" aria-expanded="false" aria-haspopup="listbox" autocomplete="off" class="devsite-search-field devsite-search-query" name="q" placeholder="Search" role="combobox" type="text" value="" > <div class="devsite-search-image material-icons" aria-hidden="true"> </div> <div class="devsite-search-shortcut-icon-container" aria-hidden="true"> <kbd class="devsite-search-shortcut-icon">/</kbd> </div> </div> </div> </form> <button type="button" search-close class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Close search"></button> </devsite-search> </div> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es" >Español</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> <devsite-user enable-profiles fp-auth id="devsite-user"> <span class="button devsite-top-button" aria-hidden="true" visually-hidden>Sign in</span> </devsite-user> </div> </div> </div> <div class="devsite-collapsible-section "> <div class="devsite-header-background"> <div class="devsite-product-id-row" > <div class="devsite-product-description-row"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> <a href="https://developers.google.com/looker-studio/visualization" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Looker Studio Community Visualizations" > Community Visualizations </a> </li> </ul> </div> </div> <div class="devsite-doc-set-nav-row"> <devsite-tabs class="lower-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Lower tabs"> <tab class="devsite-active"> <a href="https://developers.google.com/looker-studio/visualization" track-metadata-eventdetail="https://developers.google.com/looker-studio/visualization" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - guides" track-metadata-module="primary nav" aria-label="Guides, selected" data-category="Site-Wide Custom Events" data-label="Tab: Guides" track-name="guides" > Guides </a> </tab> <tab > <a href="https://developers.google.com/looker-studio/visualization/config-reference" track-metadata-eventdetail="https://developers.google.com/looker-studio/visualization/config-reference" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - reference" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Reference" track-name="reference" > Reference </a> </tab> <tab > <a href="https://developers.google.com/looker-studio/visualization/support" track-metadata-eventdetail="https://developers.google.com/looker-studio/visualization/support" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - support" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support" > Support </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars > <div class="devsite-book-nav-filter" > <span class="filter-list-icon material-icons" aria-hidden="true"></span> <input type="text" placeholder="Filter" aria-label="Type to filter" role="searchbox"> <span class="filter-clear-button hidden" data-title="Clear filter" aria-label="Clear filter" role="button" tabindex="0"></span> </div> <nav class="devsite-book-nav devsite-nav nocontent" aria-label="Side menu"> <div class="devsite-mobile-header"> <button type="button" id="devsite-close-nav" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Close navigation" aria-label="Close navigation"> </button> <div class="devsite-product-name-wrapper"> <a href="https://developers.google.com/looker-studio"> <div class="devsite-product-logo-container" size="medium" > <picture> <img class="devsite-product-logo" alt="Looker Studio" src="https://www.gstatic.com/analytics-lego/svg/ic_looker_studio.svg" srcset=" https://www.gstatic.com/analytics-lego/svg/ic_looker_studio.svg" sizes="64px" loading="lazy" > </picture> </div> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> <a href="https://developers.google.com/looker-studio" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Looker Studio" > Looker Studio </a> </li> </ul> </span> </div> </div> <div class="devsite-book-nav-wrapper"> <div class="devsite-mobile-nav-top"> <ul class="devsite-nav-list"> <li class="devsite-nav-item"> <a href="/looker-studio/connector" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Connect" track-name="connect" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Connect" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Connect </span> </a> </li> <li class="devsite-nav-item"> <a href="/looker-studio/visualization" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Visualize" track-name="visualize" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Visualize" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Visualize </span> </a> <ul class="devsite-nav-responsive-tabs"> <li class="devsite-nav-item"> <a href="/looker-studio/visualization" class="devsite-nav-title gc-analytics-event devsite-nav-has-children devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Guides" track-name="guides" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Guides" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip menu="_book"> Guides </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="_book"> </span> </a> </li> <li class="devsite-nav-item"> <a href="/looker-studio/visualization/config-reference" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Reference" track-name="reference" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Reference" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Reference </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/looker-studio/visualization/support" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Support" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Support </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/looker-studio/integrate" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Integrate" track-name="integrate" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Integrate" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Integrate </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Integrate" track-name="integrate" > <span class="devsite-nav-text" tooltip menu="Integrate"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Integrate"> </span> </span> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/looker-studio/support" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Support" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Support </span> </a> </li> </ul> </div> <div class="devsite-mobile-nav-bottom"> <ul class="devsite-nav-list" menu="_book"> <li class="devsite-nav-item"><a href="/looker-studio/visualization" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/get-started" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/get-started" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/get-started" ><span class="devsite-nav-text" tooltip>Get started</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Build a visualization</span> </div></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/define-config" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/define-config" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/define-config" ><span class="devsite-nav-text" tooltip>Configure</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/write-viz" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/write-viz" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/write-viz" ><span class="devsite-nav-text" tooltip>Write</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/upload-viz" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/upload-viz" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/upload-viz" ><span class="devsite-nav-text" tooltip>Host</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/load-viz" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/load-viz" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/load-viz" ><span class="devsite-nav-text" tooltip>Use and test</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/sharing" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/sharing" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/sharing" ><span class="devsite-nav-text" tooltip>Share</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/publish" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/publish" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/publish" ><span class="devsite-nav-text" tooltip>Publish</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Advanced guides</span> </div></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/interactions-guide" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/interactions-guide" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/interactions-guide" ><span class="devsite-nav-text" tooltip>Configuring interactions</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/caching" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/caching" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/caching" ><span class="devsite-nav-text" tooltip>Improving performance</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/library-guide" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/library-guide" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/library-guide" ><span class="devsite-nav-text" tooltip>Using the helper library</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/local-dev" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/local-dev" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/local-dev" ><span class="devsite-nav-text" tooltip>Local development</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Resources</span> </div></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/library" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/library" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/library" ><span class="devsite-nav-text" tooltip>Download the helper library</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/open-source" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/open-source" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/open-source" ><span class="devsite-nav-text" tooltip>Open Source Repository</span></a></li> <li class="devsite-nav-item"><a href="/looker-studio/visualization/developer-preview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /looker-studio/visualization/developer-preview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/looker-studio/visualization/developer-preview" ><span class="devsite-nav-text" tooltip>Developer Preview</span></a></li> </ul> <ul class="devsite-nav-list" menu="Integrate" aria-label="Side menu" hidden> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Integrate </span> </span> </li> <li class="devsite-nav-item"> <a href="/looker-studio/integrate/linking-api" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Linking API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Linking API </span> </a> </li> <li class="devsite-nav-item"> <a href="/looker-studio/integrate/api" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Looker Studio API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Looker Studio API </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Share </span> </span> </li> <li class="devsite-nav-item"> <a href="/looker-studio/integrate" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Publish a connector, visualization or report" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Publish a connector, visualization or report </span> </a> </li> <li class="devsite-nav-item"> <a href="/looker-studio/integrate/embed" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Embed and snippets" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Embed and snippets </span> </a> </li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" class="devsite-main-content" has-book-nav > <devsite-content> <article class="devsite-article"> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" aria-label="Breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://developers.google.com/" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="" > Home </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/products" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="" > Products </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/looker-studio" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="3" track-type="globalNav" track-name="breadcrumb" track-metadata-position="3" track-metadata-eventdetail="Looker Studio" > Looker Studio </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/looker-studio/visualization" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="4" track-type="globalNav" track-name="breadcrumb" track-metadata-position="4" track-metadata-eventdetail="Looker Studio Community Visualizations" > Community Visualizations </a> </li> </ul> <devsite-thumb-rating position="header"> </devsite-thumb-rating> </div> <h1 class="devsite-page-title" tabindex="-1"> Looker Studio Community Visualizations </h1> <devsite-feature-tooltip ack-key="AckCollectionsBookmarkTooltipDismiss" analytics-category="Site-Wide Custom Events" analytics-action-show="Callout Profile displayed" analytics-action-close="Callout Profile dismissed" analytics-label="Create Collection Callout" class="devsite-page-bookmark-tooltip nocontent" dismiss-button="true" id="devsite-collections-dropdown" dismiss-button-text="Dismiss" close-button-text="Got it"> <devsite-bookmark></devsite-bookmark> <span slot="popout-heading"> Stay organized with collections </span> <span slot="popout-contents"> Save and categorize content based on your preferences. </span> </devsite-feature-tooltip> <div class="devsite-page-title-meta"><devsite-view-release-notes></devsite-view-release-notes></div> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded > </devsite-toc> <div class="devsite-article-body clearfix "> <div class="video-wrapper"> <iframe class="devsite-embedded-youtube-video" data-video-id="11Ujl4y-SFA" data-autohide="1" data-showinfo="0" frameborder="0" allowfullscreen> </iframe> </div> <p>Looker Studio Community Visualizations allow you to build and use your own custom visualizations in Looker Studio. Community visualizations offer:</p> <ol> <li>The flexibility to use any visualization library and custom JavaScript and CSS for your visualization.</li> <li>The capability to define which style elements your visualization requires in the Looker Studio property panel.</li> <li>An event driven model that posts data and style information to your visualization as users interact with the report.</li> </ol> <aside class="note"><strong>Note:</strong><span> The Community Visualization feature is in "Developer Preview". To learn more about upcoming features and improvements during this period visit the <a href="/looker-studio/visualization/developer-preview">Developer Preview</a> page.</span></aside> <p><a class="button button-primary" href="/looker-studio/visualization/get-started">Get started with community visualization</a></p> <p>To see examples of community visualizations, check out the <a href="https://lookerstudio.google.com/gallery?category=visualization">report gallery</a>.</p> </div> <devsite-recommendations display="in-page" hidden yield> </devsite-recommendations> <devsite-thumb-rating position="footer"> </devsite-thumb-rating> <devsite-recommendations id="recommendations-link" yield></devsite-recommendations> <div class="devsite-floating-action-buttons"> </div> </article> <devsite-content-footer class="nocontent"> <p>Except as otherwise noted, the content of this page is licensed under the <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 License</a>, and code samples are licensed under the <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache 2.0 License</a>. For details, see the <a href="https://developers.google.com/site-policies">Google Developers Site Policies</a>. Java is a registered trademark of Oracle and/or its affiliates.</p> <p>Last updated 2024-09-18 UTC.</p> </devsite-content-footer> <devsite-notification > </devsite-notification> <div class="devsite-content-data"> <template class="devsite-content-data-template"> [[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-09-18 UTC."],[],[]] </template> </div> </devsite-content> </main> <devsite-footer-promos class="devsite-footer"> <nav class="devsite-footer-promos nocontent" aria-label="Promotions"> <ul class="devsite-footer-promos-list"> <li class="devsite-footer-promo"> <a href="http://stackoverflow.com/questions/tagged/looker-studio" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 1)" > <picture> <img class="devsite-footer-promo-icon" src="/static/site-assets/logo-stack-overflow.svg" loading="lazy" alt="Stack Overflow"> </picture> <span class="devsite-footer-promo-label"> Stack Overflow </span> </a> <div class="devsite-footer-promo-description">Ask questions using the looker-studio tag</div> </li> <li class="devsite-footer-promo"> <a href="https://issuetracker.google.com/issues?q=componentid:321382" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 2)" > <picture> <img class="devsite-footer-promo-icon" src="/static/site-assets/developers_64dp.png" loading="lazy" alt="Issue Tracker"> </picture> <span class="devsite-footer-promo-label"> Issue Tracker </span> </a> <div class="devsite-footer-promo-description">Something wrong? Send us a bug report!</div> </li> <li class="devsite-footer-promo"> <a href="https://groups.google.com/g/looker-studio-developers" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 3)" > <picture> <img class="devsite-footer-promo-icon" src="https://www.gstatic.com/images/branding/product/1x/email_64dp.png" loading="lazy" alt="Subscribe"> </picture> <span class="devsite-footer-promo-label"> Subscribe </span> </a> <div class="devsite-footer-promo-description">Sign up for Looker Studio Developer mailing list</div> </li> <li class="devsite-footer-promo"> <a href="https://github.com/googledatastudio/" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 4)" > <picture> <img class="devsite-footer-promo-icon" src="/static/site-assets/logo-github.svg" loading="lazy" alt="GitHub"> </picture> <span class="devsite-footer-promo-label"> GitHub </span> </a> <div class="devsite-footer-promo-description">Fork our samples and try them yourself</div> </li> </ul> </nav> </devsite-footer-promos> <devsite-footer-linkboxes class="devsite-footer"> <nav class="devsite-footer-linkboxes nocontent" aria-label="Footer links"> <ul class="devsite-footer-linkboxes-list"> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Connect</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://lookerstudio.google.com/data" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Connect to data </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/looker-studio/connector/get-started" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Build a connector </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Visualize</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/looker-studio/visualization" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Build a custom visualization </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/looker-studio/connector/report-templates" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Build a report template </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://lookerstudio.google.com/gallery" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Browse the Report Gallery </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Share</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/looker-studio/integrate#connector-publish" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Publish a connector </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/looker-studio/integrate#report-publish" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Publish a report template </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/looker-studio/integrate/embed" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Embed a report </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Support</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://support.google.com/looker-studio" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Help Center </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://support.google.com/looker-studio/community" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Help Forum </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/looker-studio/support" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Developer Support </a> </li> </ul> </li> </ul> </nav> </devsite-footer-linkboxes> <devsite-footer-utility class="devsite-footer"> <div class="devsite-footer-utility nocontent"> <nav class="devsite-footer-sites" aria-label="Other Google Developers websites"> <a href="https://developers.google.com/" class="devsite-footer-sites-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Developers Link"> <picture> <img class="devsite-footer-sites-logo" src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/lockup-google-for-developers.svg" loading="lazy" alt="Google Developers"> </picture> </a> <ul class="devsite-footer-sites-list"> <li class="devsite-footer-sites-item"> <a href="//developer.android.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Android Link" > Android </a> </li> <li class="devsite-footer-sites-item"> <a href="//developer.chrome.com/home" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Chrome Link" > Chrome </a> </li> <li class="devsite-footer-sites-item"> <a href="//firebase.google.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Firebase Link" > Firebase </a> </li> <li class="devsite-footer-sites-item"> <a href="//cloud.google.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Cloud Platform Link" > Google Cloud Platform </a> </li> <li class="devsite-footer-sites-item"> <a href="//ai.google.dev/" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google AI Link" > Google AI </a> </li> <li class="devsite-footer-sites-item"> <a href="/products" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer All products Link" > All products </a> </li> </ul> </nav> <nav class="devsite-footer-utility-links" aria-label="Utility links"> <ul class="devsite-footer-utility-list"> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="/terms/site-terms" data-category="Site-Wide Custom Events" data-label="Footer Terms link" > Terms </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/privacy" data-category="Site-Wide Custom Events" data-label="Footer Privacy link" > Privacy </a> </li> <li class="devsite-footer-utility-item glue-cookie-notification-bar-control"> <a class="devsite-footer-utility-link gc-analytics-event" href="#" data-category="Site-Wide Custom Events" data-label="Footer Manage cookies link" aria-hidden="true" > Manage cookies </a> </li> <li class="devsite-footer-utility-item devsite-footer-utility-button"> <span class="devsite-footer-utility-description">Sign up for the Google for Developers newsletter</span> <a class="devsite-footer-utility-link gc-analytics-event" href="/newsletter/subscribe" data-category="Site-Wide Custom Events" data-label="Footer Subscribe link" > Subscribe </a> </li> </ul> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es" >Español</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> </nav> </div> </devsite-footer-utility> <devsite-panel></devsite-panel> <devsite-concierge data-info-panel data-ai-panel data-api-explorer-panel > </devsite-concierge> </section></section> <devsite-sitemask></devsite-sitemask> <devsite-snackbar></devsite-snackbar> <devsite-tooltip ></devsite-tooltip> <devsite-heading-link></devsite-heading-link> <devsite-analytics> <script type="application/json" analytics>[{"dimensions": {"dimension1": "Signed out", "dimension11": false, "dimension6": "en", "dimension5": "en", "dimension3": false, "dimension4": "Community Visualizations"}, "gaid": "UA-24532603-1", "metrics": {"ratings_count": "metric2", "ratings_value": "metric1"}, "purpose": 1}, {"dimensions": {"dimension1": "Signed out", "dimension11": false, "dimension6": "en", "dimension5": "en", "dimension3": false, "dimension4": "Community Visualizations"}, "gaid": "UA-41425441-12", "metrics": {"ratings_count": "metric2", "ratings_value": "metric1"}, "purpose": 0}]</script> <script type="application/json" tag-management>{"at": "True", "ga4": [{"id": "G-272J68FCRF", "purpose": 1}], "ga4p": [{"id": "G-272J68FCRF", "purpose": 1}], "gtm": [], "parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "article", "projectName": "Community Visualizations", "signedIn": "False", "tenant": "developers", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}}</script> </devsite-analytics> <devsite-badger></devsite-badger> <script nonce="m3Pf5xd1e1AWwVZxPa0JQ0aKDy3nsS"> (function(d,e,v,s,i,t,E){d['GoogleDevelopersObject']=i; t=e.createElement(v);t.async=1;t.src=s;E=e.getElementsByTagName(v)[0]; E.parentNode.insertBefore(t,E);})(window, document, 'script', 'https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/js/app_loader.js', '[1,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers","https://developers-dot-devsite-v2-prod.appspot.com",1,null,["/_pwa/developers/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/favicon-new.png","https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"],1,null,[1,6,8,12,14,17,21,25,50,52,63,70,75,76,80,87,91,92,93,97,98,100,101,102,103,104,105,107,108,109,110,112,113,116,117,118,120,122,124,125,126,127,129,130,131,132,133,134,135,136,138,140,141,147,148,149,151,152,156,157,158,159,161,163,164,168,169,170,179,180,182,183,186,191,193,196],"AIzaSyAP-jjEJBzmIyKR4F-3XITp8yM9T1gEEI8","AIzaSyB6xiKGDR5O3Ak2okS4rLkauxGUG7XP0hg","developers.google.com","AIzaSyAQk0fBONSGUqCNznf6Krs82Ap1-NV6J4o","AIzaSyCCxcqdrZ_7QMeLCRY20bh_SXdAYqy70KY",null,null,null,["DevPro__enable_cloud_innovators_plus","BookNav__enable_tenant_cache_key","EngEduTelemetry__enable_engedu_telemetry","Cloud__enable_cloudx_ping","MiscFeatureFlags__developers_footer_dark_image","CloudShell__cloud_code_overflow_menu","Profiles__enable_page_saving","Profiles__enable_public_developer_profiles","Search__enable_ai_search_summaries_restricted","Cloud__enable_cloud_shell","CloudShell__cloud_shell_button","Significatio__enable_by_tenant","Concierge__enable_concierge","Search__enable_ai_search_summaries","Profiles__enable_recognition_badges","Cloud__enable_cloudx_experiment_ids","Profiles__enable_release_notes_notifications","Search__enable_ai_eligibility_checks","MiscFeatureFlags__enable_explain_this_code","Profiles__require_profile_eligibility_for_signin","Concierge__enable_concierge_restricted","Cloud__enable_cloud_shell_fte_user_flow","Profiles__enable_dashboard_curated_recommendations","Search__enable_dynamic_content_confidential_banner","Profiles__enable_complete_playlist_endpoint","Experiments__reqs_query_experiments","MiscFeatureFlags__emergency_css","MiscFeatureFlags__enable_firebase_utm","MiscFeatureFlags__enable_project_variables","Cloud__enable_legacy_calculator_redirect","TpcFeatures__enable_required_headers","Search__enable_suggestions_from_borg","DevPro__enable_developer_subscriptions","Cloud__enable_free_trial_server_call","Profiles__enable_developer_profiles_callout","Cloud__enable_cloud_dlp_service","Search__enable_page_map","Profiles__enable_awarding_url","TpcFeatures__enable_mirror_tenant_redirects","Profiles__enable_profile_collections","MiscFeatureFlags__developers_footer_image","MiscFeatureFlags__enable_variable_operator","Analytics__enable_clearcut_logging","Concierge__enable_pushui","Cloud__enable_llm_concierge_chat","Profiles__enable_completecodelab_endpoint","Cloud__enable_cloud_facet_chat","MiscFeatureFlags__enable_view_transitions"],null,null,"AIzaSyBLEMok-5suZ67qRPzx0qUtbnLmyT_kCVE","https://developerscontentserving-pa.clients6.google.com","AIzaSyCM4QpTRSqP5qI4Dvjt4OAScIN8sOUlO-k","https://developerscontentsearch-pa.clients6.google.com",1,4,null,"https://developerprofiles-pa.clients6.google.com",[1,"developers","Google for Developers","developers.google.com",null,"developers-dot-devsite-v2-prod.appspot.com",null,null,[1,1,[1],null,null,null,null,null,null,null,null,[1],null,null,null,null,null,null,[1],[1,null,null,[1,20],"/recommendations/information"],null,null,null,[1,1,1],[1,1,null,1,1]],null,[null,null,null,null,null,null,"/images/lockup-new.svg","/images/touchicon-180-new.png",null,null,null,null,1,null,null,null,null,null,null,null,null,1,null,null,null,"/images/lockup-dark-theme-new.svg",[]],[],null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,[6,1,14,15,20,22,23,29,32,36],null,[[null,null,null,[3,7,10,2,39,17,4,32,24,11,12,13,34,15,25],null,null,[1,[["docType","Choose a content type",[["Tutorial",null,null,null,null,null,null,null,null,"Tutorial"],["Guide",null,null,null,null,null,null,null,null,"Guide"],["Sample",null,null,null,null,null,null,null,null,"Sample"]]],["product","Choose a product",[["Android",null,null,null,null,null,null,null,null,"Android"],["ARCore",null,null,null,null,null,null,null,null,"ARCore"],["ChromeOS",null,null,null,null,null,null,null,null,"ChromeOS"],["Firebase",null,null,null,null,null,null,null,null,"Firebase"],["Flutter",null,null,null,null,null,null,null,null,"Flutter"],["Assistant",null,null,null,null,null,null,null,null,"Google Assistant"],["GoogleCloud",null,null,null,null,null,null,null,null,"Google Cloud"],["GoogleMapsPlatform",null,null,null,null,null,null,null,null,"Google Maps Platform"],["GooglePay",null,null,null,null,null,null,null,null,"Google Pay & Google Wallet"],["GooglePlay",null,null,null,null,null,null,null,null,"Google Play"],["Tensorflow",null,null,null,null,null,null,null,null,"TensorFlow"]]],["category","Choose a topic",[["AiAndMachineLearning",null,null,null,null,null,null,null,null,"AI and Machine Learning"],["Data",null,null,null,null,null,null,null,null,"Data"],["Enterprise",null,null,null,null,null,null,null,null,"Enterprise"],["Gaming",null,null,null,null,null,null,null,null,"Gaming"],["Mobile",null,null,null,null,null,null,null,null,"Mobile"],["Web",null,null,null,null,null,null,null,null,"Web"]]]]]],[1,1],null,1],[[["UA-24532603-1"],["UA-22084204-5"],null,null,["UA-24532603-5"],null,null,[["G-272J68FCRF"],null,null,[["G-272J68FCRF",2]]],[["UA-24532603-1",2]],null,[["UA-24532603-5",2]],null,1],[[13,10],[12,9],[5,4],[4,3],[1,1],[11,8],[14,11],[16,13],[15,12],[3,2],[6,5]],[[1,1],[2,2]]],null,4,null,null,null,null,null,null,null,null,null,null,null,null,null,"developers.devsite.google"],null,"pk_live_5170syrHvgGVmSx9sBrnWtA5luvk9BwnVcvIi7HizpwauFG96WedXsuXh790rtij9AmGllqPtMLfhe2RSwD6Pn38V00uBCydV4m"]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>