Dessinez les graphiques sur votre propre page

Le même jeton de partage pilote aussi une petite bibliothèque JavaScript construite sur Apache ECharts. Elle dessine les graphiques du produit, avec les mêmes couleurs et les mêmes règles, et gère pour vous le redimensionnement, les thèmes clair et sombre, la langue et l’accessibilité. Utilisez l’élément personnalisé sur une page simple, ou le module dans votre propre code :

<script src="https://cdn.jsdelivr.net/npm/echarts@6/dist/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@event-horizon-data/charts/dist/eh-chart.global.js"></script>

<eh-chart token="<share token>" widget="<widget id>" theme="auto"></eh-chart>

npm install @event-horizon-data/charts echarts

import { createClient, mount } from '@event-horizon-data/charts';

const client = createClient({ token: '<share token>' });
const chart = mount(document.getElementById('revenue'), {
  client,
  widgetId: '<widget id>',
  theme: 'auto',
});

La bibliothèque dessine aussi les tuiles KPI et les tableaux, permet de faire glisser la souris sur un graphique pour zoomer, filtre un graphique à partir d’un clic sur un autre et peut afficher les points horaires dans le fuseau horaire de votre choix. Les contrôles de filtre et les tableaux croisés dynamiques ne sont pas dessinés.