CINXE.COM
AG Charts Documentation
<!DOCTYPE html><html lang="en" data-astro-cid-sckkx6r4 style="--lightModeCSSUrl: url("/charts/images/sun.svg");--darkModeCSSUrl: url("/charts/images/moon.svg");"> <head><meta charset="UTF-8"><meta name="description" content="AG Charts Documentation - This page will redirect to your chosen framework"><meta name="viewport" content="width=device-width"><link rel="icon" type="image/png" sizes="196x196" href="/charts/_astro/favicon-196.Bimfhk9M.png"><link rel="icon" type="image/png" sizes="192x192" href="/charts/_astro/favicon-192.BPgSS0FN.png"><link rel="icon" type="image/png" sizes="180x180" href="/charts/_astro/favicon-180.DPLMo2LR.png"><link rel="icon" type="image/png" sizes="167x167" href="/charts/_astro/favicon-167.I4Tpyy48.png"><link rel="icon" type="image/png" sizes="152x152" href="/charts/_astro/favicon-152.cc6y96U4.png"><link rel="icon" type="image/png" sizes="128x128" href="/charts/_astro/favicon-128.DBIUHlVo.png"><link rel="icon" type="image/png" sizes="32x32" href="/charts/_astro/favicon-32.WDuB-104.png"><link rel="apple-touch-icon" sizes="180x180" href="/charts/_astro/favicon-180-touch.DLSK8QDR.png"><link rel="apple-touch-icon" sizes="167x167" href="/charts/_astro/favicon-167-touch.BlG15XMf.png"><link rel="apple-touch-icon" sizes="152x152" href="/charts/_astro/favicon-152-touch.Cer8BKXE.png"><meta name="generator" content="Astro v4.16.8"><title>AG Charts Documentation</title><link rel="canonical" href="https://www.ag-grid.com/charts/documentation/"><link rel="sitemap" type="application/xml" title="Sitemap" href="/charts/sitemap-index.xml"><!-- Facebook Meta Tags --><meta property="og:url" content="https://www.ag-grid.com/charts/documentation/"><meta property="og:type" content="website"><meta property="og:title" content="AG Charts Documentation"><meta property="og:description" content="AG Charts Documentation - This page will redirect to your chosen framework"><meta property="og:image" content="/charts/images/ag-charts-social.png"><!-- Twitter Meta Tags --><meta name="twitter:card" content="summary_large_image"><meta property="twitter:domain" content="www.ag-grid.com"><meta property="twitter:url" content="https://www.ag-grid.com/charts/documentation/"><meta name="twitter:title" content="AG Charts Documentation"><meta name="twitter:description" content="AG Charts Documentation - This page will redirect to your chosen framework"><meta name="twitter:image" content="/charts/images/ag-charts-social.png"><script>(function(){const googleTagManagerId = "GTM-5GWLR86Q"; (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer',googleTagManagerId);})();</script><script defer data-domain="ag-grid.com" src="https://plausible.io/js/script.js"></script> <script> window.plausible = window.plausible || function () { (window.plausible.q = window.plausible.q || []).push(arguments); }; </script><script async type="text/javascript" src="https://secure.sharpinspiration-instinct.com/js/793321.js"></script><noscript><img alt="" src="https://secure.sharpinspiration-instinct.com/793321.png" style="display:none;; --lightModeCSSUrl: url("/charts/images/sun.svg");--darkModeCSSUrl: url("/charts/images/moon.svg");" data-astro-cid-sckkx6r4></noscript><link rel="stylesheet" href="/charts/_astro/events.CftEvaNv.css"> <style>.logo-mark .aqua{fill:var(--color-logo-aqua)}.logo-mark .orange{fill:var(--color-logo-orange)}.logo-mark .red{fill:var(--color-logo-red)}.logo-mark .grey{fill:var(--color-logo-grey)}.logo-mark rect{animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-play-state:paused}.logo-mark:not(._bounce_1oiud_18,._loading_1oiud_18) rect{transform:translate(0)}._bounce_1oiud_18 rect[class*=right]{animation-name:_logo-mark-bounce-right_1oiud_1;animation-duration:1.15s;animation-play-state:running}._bounce_1oiud_18 rect[class*=right].right-2{animation-delay:.1916666667s}._bounce_1oiud_18 rect[class*=right].right-3{animation-delay:.3833333333s}._loading_1oiud_18 rect[class*=right]{animation-name:_logo-mark-bounce-right_1oiud_1;animation-duration:1.25s;animation-play-state:running}._loading_1oiud_18 rect[class*=right].right-2{animation-delay:.2083333333s}._loading_1oiud_18 rect[class*=right].right-3{animation-delay:.4166666667s}._loading_1oiud_18 rect[class*=left]{animation-name:_logo-mark-bounce-left_1oiud_1;animation-duration:1.25s;animation-play-state:running}._loading_1oiud_18 rect[class*=left].left-3{animation-delay:.625s}._loading_1oiud_18 rect[class*=left].left-2{animation-delay:.8333333333s}._loading_1oiud_18 rect[class*=left].left-1{animation-delay:1.0416666667s}@keyframes _logo-mark-bounce-right_1oiud_1{0%{transform:translate(0)}16.6666%{transform:translate(3px)}33.3333%{transform:translate(0)}}@keyframes _logo-mark-bounce-left_1oiud_1{0%{transform:translate(0)}16.6666%{transform:translate(-3px)}33.3333%{transform:translate(0)}} ._icon_1jqgc_1{fill:var(--icon-color, var(--color-fg-primary));width:var(--icon-size);height:var(--icon-size);transition:fill .25s ease-in-out} ._alert_1p97w_1{--icon-size: 1.5rem;display:flex;gap:8px;align-items:center;padding:8px 8px 8px 12px;background-color:var(--color-util-brand-50);border-radius:var(--radius-md);border:1px solid var(--color-util-brand-100);color:var(--color-util-brand-700);margin-top:20px;margin-bottom:32px}[data-dark-mode=true] ._alert_1p97w_1{background-color:color-mix(in srgb,var(--color-util-brand-50),var(--color-bg-primary) 60%)}._alert_1p97w_1 .icon{align-self:flex-start;position:relative;flex-shrink:0;fill:var(--color-util-brand-700)}._alert_1p97w_1 p :last-child{margin-bottom:0}._alert_1p97w_1 a{font-weight:var(--text-semibold);text-decoration:underline}._alert_1p97w_1 kbd{margin:0;padding-top:.075em;padding-bottom:.25em}._alert_1p97w_1._idea_1p97w_36 .icon{fill:orange}._alert_1p97w_1._warning_1p97w_40{color:var(--color-util-warning-700);background-color:var(--color-util-warning-50);border-color:color-mix(in srgb,var(--color-util-warning-600) 20%,var(--color-bg-primary))}[data-dark-mode=true] ._alert_1p97w_1._warning_1p97w_40{border-color:color-mix(in srgb,var(--color-util-warning-600) 30%,var(--color-bg-primary))}._alert_1p97w_1._warning_1p97w_40 .icon{fill:var(--color-util-warning-700)}._alert_1p97w_1._success_1p97w_52{color:var(--color-success);background-color:color-mix(in srgb,var(--color-success) 6%,var(--color-bg-primary));border-color:color-mix(in srgb,var(--color-success) 20%,var(--color-bg-primary))}[data-dark-mode=true] ._alert_1p97w_1._success_1p97w_52{background-color:color-mix(in srgb,var(--color-success) 10%,var(--color-bg-primary));border-color:color-mix(in srgb,var(--color-success) 28%,var(--color-bg-primary))}._alert_1p97w_1._success_1p97w_52 .icon{fill:var(--color-success)} ._clipboardButtonOuter_8cpmg_1{--clipboard-button-bg: var(--color-code-background);--clipboard-button-fg: var(--color-fg-tertiary);display:flex;align-items:center;position:absolute;top:4px;right:4px;opacity:0;z-index:2;transition:opacity .33s ease-in-out}pre:hover ._clipboardButtonOuter_8cpmg_1,._clipboardButtonOuter_8cpmg_1._hasCopied_8cpmg_13{opacity:1}._clipboardButtonOuter_8cpmg_1:hover{--clipboard-button-fg: var(--color-util-brand-400)}[data-dark-mode=true] ._clipboardButtonOuter_8cpmg_1:hover{--clipboard-button-fg: var(--color-link-hover)}._clipboardButtonOuter_8cpmg_1._hasCopied_8cpmg_13{--clipboard-button-bg: var(--color-util-gray-700);--clipboard-button-fg: var(--color-fg-white)}[data-dark-mode=true] ._clipboardButtonOuter_8cpmg_1._hasCopied_8cpmg_13{--clipboard-button-fg: var(--color-bg-primary)}.example-runner-outer ._clipboardButtonOuter_8cpmg_1{right:20px}._clipboardButton_8cpmg_1,._clipboardButtonCopied_8cpmg_34{display:flex;align-items:center;height:32px;background-color:var(--clipboard-button-bg);border-top:1px solid var(--color-border-primary);border-bottom:1px solid var(--color-border-primary)}._clipboardButton_8cpmg_1{width:calc(32px - var(--radius-sm));border-top-right-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm);border-right:1px solid var(--color-border-primary);cursor:pointer;transition:background-color .25s ease-in-out}._clipboardButton_8cpmg_1 svg{--icon-size: 22px;--icon-color: var(--clipboard-button-fg);transition:fill .25s ease-in-out}._clipboardButtonCopiedOuter_8cpmg_57{overflow:hidden}._clipboardButtonCopied_8cpmg_34{font-size:var(--text-fs-sm);font-weight:var(--text-semibold);padding-left:8px;padding-right:8px;border-top-left-radius:var(--radius-sm);border-bottom-left-radius:var(--radius-sm);border-left:1px solid var(--color-border-primary);font-weight:var(--text-regular);color:var(--clipboard-button-fg);transition:background-color .25s ease-in-out,color .25s ease-in-out;cursor:pointer} ._icon_1jqgc_1{fill:var(--icon-color, var(--color-fg-primary));width:var(--icon-size);height:var(--icon-size);transition:fill .25s ease-in-out} ._docsHeaderIcon_15ivl_1{position:relative;padding-left:0;margin-left:8px;font-size:inherit;opacity:0;transition:opacity .33s ease-in-out}._docsHeaderIcon_15ivl_1 svg{position:relative;top:-.1em;width:.85em;height:.85em;visibility:visible;fill:var(--color-link)}._docsHeaderIcon_15ivl_1:hover{opacity:1}h1:hover ._docsHeaderIcon_15ivl_1,h2:hover ._docsHeaderIcon_15ivl_1,h3:hover ._docsHeaderIcon_15ivl_1,h4:hover ._docsHeaderIcon_15ivl_1,h5:hover ._docsHeaderIcon_15ivl_1,h6:hover ._docsHeaderIcon_15ivl_1{opacity:.5}h1:hover ._docsHeaderIcon_15ivl_1:hover,h2:hover ._docsHeaderIcon_15ivl_1:hover,h3:hover ._docsHeaderIcon_15ivl_1:hover,h4:hover ._docsHeaderIcon_15ivl_1:hover,h5:hover ._docsHeaderIcon_15ivl_1:hover,h6:hover ._docsHeaderIcon_15ivl_1:hover{opacity:1} ._cta_13t5y_1{position:relative}._cta_13t5y_1 a,._cta_13t5y_1 button{display:flex;justify-content:center;align-items:center;width:40px;height:40px;border-radius:var(--radius-sm);transition:color .25s ease-in-out,background-color .25s ease-in-out;cursor:pointer}._cta_13t5y_1 a:hover,._cta_13t5y_1 button:hover{background-color:var(--color-util-brand-100)}._cta_13t5y_1 a:focus-visible,._cta_13t5y_1 button:focus-visible{outline:none;box-shadow:0 0 0 4px var(--color-button-primary-shadow-focus),var(--shadow-xs)}._cta_13t5y_1 a svg,._cta_13t5y_1 button svg{--icon-size: 1.25em;fill:var(--color-link);transform:translate(1px,.75px);transition:fill .25s ease-in-out}li:first-child ._cta_13t5y_1 a svg,li:first-child ._cta_13t5y_1 button svg{--icon-size: 1.35em}[data-dark-mode=true] ._cta_13t5y_1 a:hover,[data-dark-mode=true] ._cta_13t5y_1 button:hover{background-color:var(--color-util-brand-50)}@supports (-webkit-touch-callout: none){._cta_13t5y_1 button{display:none}}._tooltip_13t5y_46{--tooltip-background: var(--color-fg-primary);position:absolute;display:block;color:var(--color-bg-primary);top:-44px;left:50%;padding:4px 16px;white-space:nowrap;font-weight:600;background-color:var(--tooltip-background);border-radius:6px;transform:translate(-50%,4px);opacity:0;pointer-events:none;transition-delay:0;transition:opacity .165s ease-in,transform .165s ease-in;z-index:1}._tooltip_13t5y_46:before{content:"";position:absolute;background-color:var(--tooltip-background);width:16px;height:16px;transform:rotate(45deg);bottom:-7px;left:calc(50% - 8px);border-radius:3px;z-index:-1}._cta_13t5y_1:hover ._tooltip_13t5y_46{opacity:1;transform:translate(-50%);transition:opacity .33s ease-in,transform .33s ease-in;transition-delay:.165s}[data-dark-mode=true] ._tooltip_13t5y_46{--tooltip-background: var(--color-bg-secondary);color:var(--color-fg-primary);box-shadow:0 -4px 16px #0006} </style> <link rel="stylesheet" href="/charts/_astro/_pageName_.CZ8Nn9nG.css"> <link rel="stylesheet" href="/charts/_astro/LicenseSetup.C8PU3bBB.css"><script type="module" src="/charts/_astro/hoisted.BBY23hy_.js"></script></head> <body data-astro-cid-sckkx6r4 style="--lightModeCSSUrl: url("/charts/images/sun.svg");--darkModeCSSUrl: url("/charts/images/moon.svg");"> <script> const htmlEl = document.querySelector('html'); const localDarkmode = localStorage['documentation:darkmode']; const isOSDarkmode = ( window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ).toString(); htmlEl.classList.add('no-transitions'); htmlEl.dataset.darkMode = localDarkmode !== undefined ? localDarkmode : isOSDarkmode; htmlEl.offsetHeight; // Trigger a reflow, flushing the CSS changes htmlEl.classList.remove('no-transitions'); </script> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5GWLR86Q" height="0" width="0" style="display:none;visibility:hidden; --lightModeCSSUrl: url("/charts/images/sun.svg");--darkModeCSSUrl: url("/charts/images/moon.svg");" data-astro-cid-sckkx6r4></iframe></noscript> <div class="mainContainer" data-astro-cid-sckkx6r4 style="--lightModeCSSUrl: url("/charts/images/sun.svg");--darkModeCSSUrl: url("/charts/images/moon.svg");"> <header class="_header_1agp5_1 site-header"> <div class="_headerInner_1agp5_20 layout-page-max-width"> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event("astro:load"));})();;(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t),11:t=>1/0*t},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script><astro-island uid="ZDhylf" prefix="r0" component-url="/charts/_astro/SiteLogo.hhRgKJhN.js" component-export="SiteLogo" renderer-url="/charts/_astro/client.DSaewLOF.js" props="{}" ssr="" client="load" opts="{"name":"SiteLogo","value":true}" await-children=""><a href="/charts/" aria-label="Home" class="_headerLogo_1agp5_36"><svg xmlns="http://www.w3.org/2000/svg" class="logotype" width="198" height="40" viewBox="0 0 198 40"><style> .logotype path { fill: #fff; } .logotype.dark-type>path { fill: #003264; } </style><path d="M25.779 28.657h-12.42l-2.186 5.355h-5.5L17.182 7.06h4.771l11.509 26.952h-5.5l-2.186-5.355h.003Zm-1.711-4.26-4.48-10.963-4.481 10.963h8.961ZM62.092 18.823H49.817v4.263h6.958c-.22 2.136-1.02 3.841-2.403 5.116-1.383 1.274-3.206 1.913-5.463 1.913-1.287 0-2.459-.23-3.516-.692a7.776 7.776 0 0 1-2.713-1.947c-.753-.837-1.336-1.845-1.749-3.023-.412-1.178-.62-2.483-.62-3.916 0-1.432.205-2.737.62-3.916.413-1.178.996-2.185 1.749-3.023a7.763 7.763 0 0 1 2.731-1.947c1.067-.462 2.245-.691 3.535-.691 2.666 0 4.691.642 6.074 1.925l3.28-3.28C55.817 7.67 52.676 6.7 48.872 6.7c-2.112 0-4.019.335-5.718 1.001-1.699.667-3.156 1.603-4.371 2.803-1.216 1.203-2.149 2.654-2.806 4.353-.658 1.699-.983 3.594-.983 5.683 0 2.09.335 3.954 1.001 5.665.667 1.711 1.61 3.169 2.822 4.372 1.215 1.203 2.669 2.136 4.371 2.806 1.7.666 3.594 1.001 5.684 1.001 2.089 0 3.878-.335 5.518-1.001 1.641-.667 3.036-1.603 4.189-2.806 1.154-1.203 2.04-2.661 2.66-4.372.621-1.711.931-3.6.931-5.665a19.88 19.88 0 0 0-.075-1.711l-.003-.006ZM151.81 16.981c1.6-2.372 5.609-2.623 7.212-2.623v4.552c-2.065 0-4.037.086-5.265.982-1.228.9-1.838 2.09-1.838 3.572V33.99h-4.955V14.358h4.772l.074 2.623ZM143.011 14.361v19.67h-4.771l-.109-2.986a7.269 7.269 0 0 1-2.66 2.459c-1.095.595-2.403.892-3.935.892-1.336 0-2.573-.244-3.714-.728a8.714 8.714 0 0 1-2.967-2.059c-.837-.887-1.501-1.947-1.984-3.187-.487-1.237-.729-2.611-.729-4.118 0-1.506.242-2.926.729-4.188.486-1.262 1.147-2.344 1.984-3.243a8.79 8.79 0 0 1 2.967-2.093c1.141-.499 2.381-.747 3.714-.747 1.507 0 2.794.285 3.861.855a7.529 7.529 0 0 1 2.66 2.388v-2.915h4.954Zm-10.38 15.772c1.625 0 2.936-.539 3.934-1.621.996-1.082 1.495-2.521 1.495-4.316s-.499-3.206-1.495-4.297c-.995-1.092-2.306-1.641-3.934-1.641-1.628 0-2.902.546-3.897 1.641-.996 1.094-1.495 2.539-1.495 4.334 0 1.795.496 3.2 1.495 4.282.995 1.079 2.294 1.621 3.897 1.621v-.003ZM93.698 27.876a7.077 7.077 0 0 1-.369.366c-1.382 1.274-3.206 1.913-5.463 1.913-1.286 0-2.458-.229-3.516-.691a7.785 7.785 0 0 1-2.713-1.947c-.753-.838-1.336-1.845-1.748-3.023-.413-1.179-.62-2.484-.62-3.916 0-1.433.204-2.738.62-3.916.412-1.178.995-2.186 1.748-3.023a7.766 7.766 0 0 1 2.732-1.947c1.067-.462 2.245-.692 3.534-.692 2.667 0 4.692.642 6.074 1.926l3.281-3.281c-2.484-1.934-5.625-2.905-9.429-2.905-2.111 0-4.018.335-5.717 1.002-1.699.666-3.156 1.603-4.372 2.803-1.215 1.202-2.148 2.654-2.806 4.353-.657 1.699-.983 3.593-.983 5.683 0 2.089.335 3.953 1.002 5.664.666 1.712 1.609 3.169 2.821 4.372 1.216 1.203 2.67 2.136 4.372 2.806 1.699.667 3.593 1.001 5.683 1.001s3.879-.334 5.519-1.001c1.37-.558 2.57-1.302 3.6-2.232.201-.183.4-.376.589-.571l-3.836-2.735-.003-.009ZM110.802 14.015c-1.603 0-3.966.456-5.191 2.143l-.074-10.142h-4.772v27.923h4.955V22.641a4.463 4.463 0 0 1 4.638-4.267c3.039 0 3.91 2.785 3.91 4.267v11.298h4.955v-12.88s-.081-7.044-8.421-7.044ZM173.763 14.358h-3.764V8.715h-4.951v5.643h-3.764v4.558h3.764v15.087h4.951V18.916h3.764v-4.558ZM190.787 25.262a6.672 6.672 0 0 0-2.403-1.761c-.896-.384-2.053-.769-3.436-1.137a36.605 36.605 0 0 1-2.325-.738 3.609 3.609 0 0 1-1.24-.751 1.377 1.377 0 0 1-.456-1.057c0-.546.229-.974.698-1.308.496-.354 1.237-.534 2.201-.534s1.761.233 2.322.692c.558.456.859 1.057.924 1.832l.022.282h4.539l-.016-.322c-.096-1.975-.846-3.56-2.232-4.71-1.373-1.138-3.2-1.717-5.423-1.717-1.485 0-2.821.254-3.968.753-1.163.505-2.068 1.209-2.698 2.096a5.047 5.047 0 0 0-.955 2.967c0 1.318.357 2.4 1.058 3.215a6.424 6.424 0 0 0 2.443 1.78c.902.372 2.086.763 3.519 1.156 1.445.41 2.511.785 3.169 1.123.57.291.849.722.849 1.321 0 .598-.257 1.023-.784 1.395-.552.387-1.358.586-2.394.586-1.035 0-1.807-.251-2.452-.751-.636-.493-.977-1.085-1.039-1.81l-.025-.282h-4.672l.012.319a5.86 5.86 0 0 0 1.163 3.305c.719.974 1.705 1.752 2.93 2.313 1.218.558 2.614.843 4.148.843 1.535 0 2.843-.254 3.972-.753 1.138-.505 2.034-1.215 2.663-2.115.633-.902.952-1.94.952-3.091-.025-1.293-.387-2.35-1.076-3.141h.01Z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" class="logo-mark" width="64" height="48" viewBox="0 0 64 48"><style> .logomark .aqua { fill: #55b4c8; } .logomark .orange { fill: #ff8c00; } .logomark .red { fill: #f00; } .logomark .grey { fill: #b4bebe; } </style><rect class="aqua right-1" x="51" y="10" width="7" height="8"></rect><path class="aqua right-1" d="M58,10l-17,0l-8,8l25,0l0,-8Z"></path><rect class="orange right-2" x="36" y="22" width="7" height="8"></rect><path class="orange right-2" d="M43,30l0,-7.995l-14,-0l-8.008,7.995l22.008,0Z"></path><rect class="red right-3" x="24" y="34" width="7" height="8"></rect><path class="red right-3" d="M13,38.01l4,-4.01l14,0l0,8l-18,0l0,-3.99Z"></path><rect class="grey left-1" x="11" y="6" width="7" height="8"></rect><path class="grey left-1" d="M41,10l-4,4l-26,0l0,-8l30,0l0,4Z"></path><rect class="grey left-2" x="16" y="18" width="7" height="8"></rect><path class="grey left-2" d="M16,26l9,0l8,-8l-17,-0l0,8Z"></path><rect class="grey left-3" x="6" y="30" width="7" height="8"></rect><path class="grey left-3" d="M6,37.988l7,0.012l7.992,-8l-14.992,-0.047l-0,8.035Z"></path></svg></a><!--astro:end--></astro-island> <astro-island uid="1wil1d" prefix="r1" component-url="/charts/_astro/ProductDropdown.MkslNmro.js" component-export="ProductDropdown" renderer-url="/charts/_astro/client.DSaewLOF.js" props="{"items":[1,[[0,{"title":[0,"AG Grid"],"description":[0,"Best JavaScript Grid in the World"],"url":[0,"https://www.ag-grid.com"]}],[0,{"title":[0,"AG Charts"],"description":[0,"Best JavaScript Charts in the World"],"url":[0,"https://www.ag-grid.com/charts"]}]]],"children":[0,null]}" ssr="" client="load" opts="{"name":"ProductDropdown","value":true}" await-children=""><div class="_customMenu_zefh0_1 "><button class="_customTrigger_zefh0_23 ">Products<span class="_arrow_zefh0_51"></span></button></div><!--astro:end--></astro-island> <astro-island uid="1Xzdbs" prefix="r2" component-url="/charts/_astro/HeaderNav.CTtd2oBs.js" component-export="HeaderNav" renderer-url="/charts/_astro/client.DSaewLOF.js" props="{"currentPath":[0,"/charts/documentation/"],"items":[1,[[0,{"title":[0,"AG Grid"],"url":[0,"https://www.ag-grid.com/"],"isCollapsed":[0,true]}],[0,{"title":[0,"Gallery"],"path":[0,"/gallery"]}],[0,{"title":[0,"Docs"],"path":[0,"./quick-start"]}],[0,{"title":[0,"API"],"path":[0,"/options"]}],[0,{"title":[0,"Community"],"path":[0,"/community"]}],[0,{"title":[0,"Pricing"],"path":[0,"/license-pricing"]}],[0,{"title":[0,"GitHub"],"url":[0,"https://github.com/ag-grid/ag-charts"],"icon":[0,"github"],"github":[0,"true"]}]]],"allPaths":[1,[[0,{"title":[0,"AG Grid"],"url":[0,"https://www.ag-grid.com/"],"isCollapsed":[0,true]}],[0,{"title":[0,"Gallery"],"path":[0,"/gallery"]}],[0,{"title":[0,"Docs"],"path":[0,"./quick-start"]}],[0,{"title":[0,"API"],"path":[0,"/options"]}],[0,{"title":[0,"Community"],"path":[0,"/community"]}],[0,{"title":[0,"Pricing"],"path":[0,"/license-pricing"]}],[0,{"title":[0,"GitHub"],"url":[0,"https://github.com/ag-grid/ag-charts"],"icon":[0,"github"],"github":[0,"true"]}],[0,{"title":[0,"API"],"path":[0,"/charts/options"]}],[0,{"title":[0,"API"],"path":[0,"/charts/themes-api"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/api-state"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/api-state"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/api-state"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/api-state"]}],[0,{"title":[0,"Docs"],"path":[0,"/charts/react"]}],[0,{"title":[0,"Docs"],"path":[0,"/charts/angular"]}],[0,{"title":[0,"Docs"],"path":[0,"/charts/vue"]}],[0,{"title":[0,"Docs"],"path":[0,"/charts/javascript"]}]]],"apiPaths":[1,[[0,{"title":[0,"API"],"path":[0,"/charts/options"]}],[0,{"title":[0,"API"],"path":[0,"/charts/themes-api"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/api-create-update"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/events"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/api-download"]}],[0,{"title":[0,"API"],"path":[0,"/charts/react/api-state"]}],[0,{"title":[0,"API"],"path":[0,"/charts/angular/api-state"]}],[0,{"title":[0,"API"],"path":[0,"/charts/vue/api-state"]}],[0,{"title":[0,"API"],"path":[0,"/charts/javascript/api-state"]}]]]}" ssr="" client="load" opts="{"name":"HeaderNav","value":true}" await-children=""><div class="_mainNav_1agp5_191"><nav class="_mainNavLarge_1agp5_191"><ul class="_navItemList_1agp5_225 list-style-none"><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/gallery/" aria-label="AG Grid Gallery"><span>Gallery</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/react/quick-start/" aria-label="AG Grid Docs"><span>Docs</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/options/" aria-label="AG Grid API"><span>API</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/community/" aria-label="AG Grid Community"><span>Community</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/license-pricing/" aria-label="AG Grid Pricing"><span>Pricing</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320 _githubItem_1agp5_316"><a class="_navLink_1agp5_243" href="https://github.com/ag-grid/ag-charts" aria-label="AG Grid GitHub"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16,2a14,14,0,0,0-4.43,27.28c.7.13,1-.3,1-.67s0-1.21,0-2.38c-3.89.84-4.71-1.88-4.71-1.88A3.71,3.71,0,0,0,6.24,22.3c-1.27-.86.1-.85.1-.85A2.94,2.94,0,0,1,8.48,22.9a3,3,0,0,0,4.08,1.16,2.93,2.93,0,0,1,.88-1.87c-3.1-.36-6.37-1.56-6.37-6.92a5.4,5.4,0,0,1,1.44-3.76,5,5,0,0,1,.14-3.7s1.17-.38,3.85,1.43a13.3,13.3,0,0,1,7,0c2.67-1.81,3.84-1.43,3.84-1.43a5,5,0,0,1,.14,3.7,5.4,5.4,0,0,1,1.44,3.76c0,5.38-3.27,6.56-6.39,6.91a3.33,3.33,0,0,1,.95,2.59c0,1.87,0,3.38,0,3.84s.25.81,1,.67A14,14,0,0,0,16,2Z"></path></svg><span>GitHub</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320"><button class="_navLink_1agp5_243 button-style-none" aria-label="Dark mode selector"><div class="_icon_1agp5_88 _pseudoIcon_1agp5_324"></div><span>Dark Mode</span></button></li></ul></nav></div><button class="_mobileMenuButton_1agp5_117" type="button" aria-controls="_mainNavSmall_1agp5_1" aria-expanded="false" aria-label="Toggle navigation"><svg xmlns="http://www.w3.org/2000/svg" class="_menuIcon_1agp5_153" width="36" height="36" viewBox="0 0 36 36"><style> .menu-icon rect { fill: #fff; } </style><g class="top"><rect x="2" y="7" width="32" height="2"></rect></g><g class="middle"><rect x="2" y="17" width="32" height="2"></rect></g><g class="bottom"><rect x="2" y="27" width="32" height="2"></rect></g></svg></button><div id="_mainNavSmall_1agp5_1" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><nav class="_mainNav_1agp5_191"><ul class="_navItemList_1agp5_225 list-style-none"><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="https://www.ag-grid.com/" aria-label="AG Grid AG Grid"><span>AG Grid</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/gallery/" aria-label="AG Grid Gallery"><span>Gallery</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/react/quick-start/" aria-label="AG Grid Docs"><span>Docs</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/options/" aria-label="AG Grid API"><span>API</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/community/" aria-label="AG Grid Community"><span>Community</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/charts/license-pricing/" aria-label="AG Grid Pricing"><span>Pricing</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320 _githubItem_1agp5_316"><a class="_navLink_1agp5_243" href="https://github.com/ag-grid/ag-charts" aria-label="AG Grid GitHub"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16,2a14,14,0,0,0-4.43,27.28c.7.13,1-.3,1-.67s0-1.21,0-2.38c-3.89.84-4.71-1.88-4.71-1.88A3.71,3.71,0,0,0,6.24,22.3c-1.27-.86.1-.85.1-.85A2.94,2.94,0,0,1,8.48,22.9a3,3,0,0,0,4.08,1.16,2.93,2.93,0,0,1,.88-1.87c-3.1-.36-6.37-1.56-6.37-6.92a5.4,5.4,0,0,1,1.44-3.76,5,5,0,0,1,.14-3.7s1.17-.38,3.85,1.43a13.3,13.3,0,0,1,7,0c2.67-1.81,3.84-1.43,3.84-1.43a5,5,0,0,1,.14,3.7,5.4,5.4,0,0,1,1.44,3.76c0,5.38-3.27,6.56-6.39,6.91a3.33,3.33,0,0,1,.95,2.59c0,1.87,0,3.38,0,3.84s.25.81,1,.67A14,14,0,0,0,16,2Z"></path></svg><span>GitHub</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320"><button class="_navLink_1agp5_243 button-style-none" aria-label="Dark mode selector"><div class="_icon_1agp5_88 _pseudoIcon_1agp5_324"></div><span>Dark Mode</span></button></li></ul></nav></div></div><!--astro:end--></astro-island> </div> </header> <div class="layout-grid"> <h1>Redirecting to AG Charts Documentation...</h1> </div> <!-- Redirect page to framework page based on stored internal framework NOTE: Need to put var into data attribute as Astro can't pass directly into build time JavaScript --> <div id="redirectUrl" data-redirect-url="./quick-start"></div> </div> </body> </html>