#1

Par MdAions le 23/06/2019 à 17h39 :

Bonjour,
Félicitations, l'idée de faire un script réduit est très intéressante. Toutefois il manquerait 2 choses :
- la possibilité de remplacer les points, triangles, rectangles par du texte variable en fonction du point,
- passer l'échelle des axes (au moins l'axe des y) en logarithmique
Qu'en pensez-vous ?

#2

Par Patrice le 28/06/2019 à 11h25 :

Bonjour MdAions,

Merci pour le message. Effectivement il faudrait faire évoluer cette base. J'avais déjà fait des corrections pour gérer le survol de la souris (dans le cas d'un site qui affiche des fichier GPX sur une carte, le graphique servant à afficher le dénivelé).

Efffectivement remplacer le point (ou le compléter avec) un texte me parait indispensable, ainsi qu'une meilleure gestion des axes.

#3

Par sam_play le 20/07/2020 à 22h57 :

Bonsoir,

Merci pour le partage. Je trouve ce sujet très intéressant.

J'espère ne pas être hors sujet avec mes questions suivantes.

Est-ce que votre code permet de rajouter un graphique qui a des dates en abscisses?
Si oui, je n'ai pas vu comment faire dans votre billet.
Remarque : J'ai testé avec les Data [[2019-08-09,14],[2019-08-16,18],...] à la place de votre exemple [[4, 21],[8, 23],...], mais les abscisses ne sont pas les dates indiquées

De même je n'ai pas vu comment dynamiser les données résultantes d'une requête SQL.
Est-ce possible ?

Merci d'avance pour votre réponse

#4

Par Diego le 17/12/2021 à 09h43 :

Bonjour,
Je m'amuse à reproduire une ti-82 en js, et j'aimerai utilisé votre script pour la partie graphique. Cela dit, je n'arrive pas à effacer un graphique une fois celui-ci Draw. Auriez vous une astuce? (Je ne comprends pas comment DataDelete fonctionne)

Merci d'avance !

#5

Par Patrice le 17/12/2021 à 10h20 :

Bonjour Diego,

Il faut ajouter une petite fonction pour effacer le contenu du SVG

function SVGDelete(aId){

	let e = document.getElementById(aId);

	if(!e) return 0;

	while(e.firstChild){

	    e.removeChild(e.firstChild);

	}

	return 1;

}

La fonction DataDelete attend le titre du jeux de données en paramètre.
Pour ajouter un jeux de donnée :
graph.DataAdd({
title: 'donnee1',
data: [
[1, 2],
[3, 4],
[5, 6]
]
});

Pour l'effacer :
graph.DataDelete('donnee1');

Une fois les données effacées, il faut effacer le graphique (avec SVGDelete()) et redessiner le graphique (avec graph.Draw())

#6

Par grizm le 13/11/2022 à 09h46 :

bonjour,
il est génial votre script, j'aime son style.
En revanche, j'ai un problème vraisemblablement de visibilité entre les deux scripts, je me ramasse un "Uncaught ReferenceError: jsGraphDisplay is not defined"
Si quelqu'un a une idée, je suis preneur, je ne doute pas que je le ferai marcher un jour mais ça risque de me prendre du temps.
Merci pour ce code.

#7

Par Patrice le 13/11/2022 à 09h59 :

Bonjour grizm,

Le script est chargé au moment de l'appel ?

Pour en être sûr le mieux est de placer la création dans un évènement DOMContentLoaded

document.addEventListener('DOMContentLoaded', (event) => {
var graph = new jsGraphDisplay();
// etc
});