Le composant Javascript GXMLDISPLAY permet d’afficher des données tabulaires dans des pages web, de manière dynamique (tri étendu sur les colonnes) et multimodal : textes, numériques, liens, images, objets métier … Dans un contexte lié aux ilots de données, potentiellement issus de données tabulaires tels que du CSVM. Il s’agira de collectes expérimentales ou de compilation de connaissances (par exemple une étude structurale) réalisées d’une manière manuelle ou automatisée, issues d’un flot de calcul ou d’un traitement orienté données. Nous voulons une exposition contrôlée, sans modification des informations, avec un même mécanisme utilisable en local ou sur un serveur, et avec un minimum d’infrastructures (notamment pas de SGBDR et PHP).

Publication initiale : buidez.net (2011) – revu et mis à jour en 2025.

1. Les données

Le composant GXMLDISPLAY est alimenté par des tables Javascript, qu’il faudra générer ou écrire directement, ce n’est pas très compliqué. Dans un premier temps il faut comprendre la structure de ces données. Pour l’exemple, nous allons partir de la table suivante qui correspond à une collection de petites molécules (ligands) qui correspondent à des substrats ou des inhibiteurs connus pour être co-cristallisés avec une enzyme (Beta-glucosidase A, bglA, 3.2.1.21 pour les curieux) et référencés dans la Protein Data Bank (PDB).

Cette table est composé de 8 colonnes incluant une description sommaire du ligand (colonne DESC), sa formule développée au format SMILES (colonne SMILES), son identifiant au sens de la PDB (LIG), la structure dans laquelle il est co-cristallisé (colonne PDB). Les colonnes TYPE et SECTOR correspondent à des colonnes de contrôle, type de protéine et domaine UNIPROT (pour la colonne SECTOR, par exemple Q08638 de Thermotoga maritima). Nous avons également des images des ligands (formule 2D, colonne IMG). Enfin, nous avons des fichiers de coordonnées (colonne 3DREF) téléchargeables, ces données correspondent aux coordonnées 3D moléculaires des ligands après alignement des protéines inclusives dans le même espace de référence.

Ce type de table peut être encodée en CSVM, nous pouvons avoir une correspondance directe, par exemple :

Les colonnes correspondant aux commentaires et aux métadonnées sont colorées, les données SMILES sont grisées. A noter que l’ordre des colonnes peut être important dans ce type de table. Par exemple, intuitivement nous placerions les colonnes de contrôle en premier, suivies par les identifiants de ligands. Mais nous pouvons également placer la colonne SMILES en premier, la table CSVM devient :

Sans autre modifications, si nous changeons l’extension du fichier, en la faisant passer de .csvm à .smi, le fichier peut être directement affiché par un viewer de données SDF tel Chemaxon Marvin View. Nous aurons un affichage du type :