Setting the License

ApexGantt displays a watermark on charts rendered without a valid license. To remove it, call ApexGantt.setLicense() with your key before creating any chart instance.

import ApexGantt from 'apexgantt'

ApexGantt.setLicense('YOUR-LICENSE-KEY')

const gantt = new ApexGantt(el, options)
gantt.render()

The key is validated client-side. No network request is made and the key does not expire at runtime.

Where to put the call

Call setLicense once at application startup, before any new ApexGantt() calls. The right place depends on your framework.

Vanilla JS / plain HTML:

// In your entry file, before any chart code
ApexGantt.setLicense('YOUR-LICENSE-KEY')

React (App Router / Next.js):

// In a client layout or the top-level component
'use client'
import ApexGantt from 'apexgantt'
ApexGantt.setLicense(process.env.NEXT_PUBLIC_APEXGANTT_LICENSE)

Vue 3:

// main.js
import { createApp } from 'vue'
import ApexGantt from 'apexgantt'
import App from './App.vue'

ApexGantt.setLicense(import.meta.env.VITE_APEXGANTT_LICENSE)
createApp(App).mount('#app')

Angular:

// main.ts
import ApexGantt from 'apexgantt'
ApexGantt.setLicense(environment.apexganttLicense)

Keeping the key out of source control

Store the license key in an environment variable, not in your source code.

# .env (git-ignored)
NEXT_PUBLIC_APEXGANTT_LICENSE=your-license-key-here
VITE_APEXGANTT_LICENSE=your-license-key-here

Add .env to your .gitignore. In production, set the variable through your hosting platform (Vercel, Netlify, Docker, etc.).

License key not working

  • The watermark appears even with setLicense called if the call happens after new ApexGantt(...). Move setLicense above any chart instantiation.
  • Keys are tied to the domain the chart is served from. A key issued for example.com will not suppress the watermark on localhost during development. Contact support if you need a separate development key.
  • You receive your license key via email after purchasing a plan at apexcharts.com/pricing.