ANS-1830 · DéVELOPPEMENT SUITESCRIPT
Comment implémenter des graphiques Google personnalisés dans les tableaux de bord NetSuite
Ce guide décrit la procédure à suivre pour intégrer des graphiques Google interactifs et des contrôles personnalisés dans NetSuite à l'aide de SuiteScript et de la bibliothèque de modèles Mustache.js.
Solution courte
Pour créer des graphiques Google personnalisés dans NetSuite, utilisez SuiteScript afin d’intégrer les API Google Charts et la bibliothèque de modèles Mustache.js. Cela implique de définir les types de graphiques, les formats de données et les options de contrôle, puis de déployer les scripts nécessaires pour afficher des visualisations dynamiques au sein de portlets ou de tableaux de bord personnalisés.
Scénario
Les entreprises ont souvent besoin de visualisations de données hautement personnalisées au sein de leurs tableaux de bord NetSuite, qui vont au-delà des fonctionnalités de reporting standard. Cela nécessite l’intégration de bibliothèques de graphiques externes afin de créer des graphiques à barres interactifs, des contrôles et d’autres éléments dynamiques permettant une analyse approfondie des données.
Solution
La mise en œuvre de Google Charts personnalisés au sein de NetSuite implique plusieurs composants et étapes clés pour intégrer des bibliothèques externes et générer des visualisations dynamiques. Bien que NetSuite propose des outils natifs avancés de visualisation des données, tels que SuiteAnalytics Workbook et NetSuite Analytics Warehouse, l’intégration de Google Charts via SuiteScript reste une approche valable pour répondre à des besoins personnalisés très spécifiques.
Comprendre les principes fondamentaux de Google Charts
- Familiarisez-vous avec la documentation de Google Charts, en particulier celle consacrée aux graphiques à barres, afin de comprendre les types de graphiques, les options, les formats de données, les événements et la configuration.
- https://developers.google.com/chart/interactive/docs/gallery/barchart#overview
- Apprenez à créer des tableaux de bord interactifs à l’aide de Google Charts, notamment en créant des graphiques et les filtres associés (contrôles).
- https://developers.google.com/chart/interactive/docs/gallery/controls#overview
Intégrer Mustache.js pour la création de modèles Web
- Utilisez la bibliothèque Mustache.js pour créer efficacement des modèles Web, ce qui facilite le rendu de contenu dynamique pour vos graphiques et vos contrôles.
- https://github.com/janl/mustache.js
- https://raw.githubusercontent.com/janl/mustache.js/master/mustache.js
- Consultez des exemples d’intégration de Mustache.js avec Google Charts pour obtenir des conseils pratiques de mise en œuvre :
- http://jsfiddle.net/asgallant/wauu2/
- http://jsfiddle.net/asgallant/rS4L8/
Déploiement de SuiteScript et des fichiers personnalisés
- Les SuiteScripts et fichiers associés nécessaires à l’intégration de Google Charts sont généralement stockés dans des répertoires de projet personnalisés au sein du « File Cabinet » de NetSuite, plutôt que dans un chemin d’accès système standard. Pour des implémentations de projet spécifiques, ces fichiers peuvent se trouver dans des emplacements similaires à :
GA_KEEP_0001*
Assurez-vous que toutes les bibliothèques JavaScript requises (chargeur Google Charts, Mustache.js) sont correctement téléchargées et référencées dans votre SuiteScript.
Détails de la tâche de projet de référence
- Pour le contexte spécifique du projet ou la documentation associée, veuillez vous reporter à la tâche de projet correspondante dans NetSuite :
- https://system.netsuite.com/app/accounting/project/projecttask.nl?ide1046&whence
Support expert NetSuite
Besoin d’aide pour cet enjeu NetSuite ?
Accompagnement-conseil et configuration pour Développement SuiteScript
