[Feat] Grafikfarben anpassen

Hallo zusammen,

Da die Farben der Diagramme nicht anpassbar waren, habe ich an einer Funktion gearbeitet, um sie etwas zu individualisieren. Ich erstelle diesen Beitrag, um eine Diskussion darüber zu eröffnen, bevor ich einen Pull Request öffne.

Das Erste, was mich gestört hat, war, dass alle Diagramme blau waren, und zwar zwingend. In dem unten stehenden Beispiel hätte ich gerne meine Luftfeuchtigkeit in Blau und meine Temperatur in Gelb gehabt, um die Farben mit den Daten zu korrelieren und sie so zu unterscheiden:

Dann habe ich festgestellt, dass nur 4 Farben verfügbar waren (von denen die letzten beiden sehr ähnlich sind). Bei mehr als 4 Daten wird eine Rotation durchgeführt:

Ich wollte also versuchen, die Farben der Diagramme anpassbar zu machen.
In dieser ersten Iteration geht es nur darum, selbst aus den 4 Farben auswählen zu können. (Ich habe die Gelegenheit genutzt, um das zweite „Gelb“ durch ein Grün zu ersetzen).
Diese Funktion erfüllt den Bedarf Nr. 1, ändert aber nichts an Nr. 2 für den Moment.
Aber es wäre leicht möglich, wenn wir es wünschen, mehr Farben hinzuzufügen. (Die ultimative Lösung wäre, einen Farbauswahl-Tool zu bieten, aber ich denke, das ist kontraproduktiv, eine Farbe aus einer Palette auszuwählen, kann für manche eine Frustration sein).

Hier ist eine schnelle Demonstration der Funktion:

Im Fall, dass nur ein Datensatz angezeigt wird, kann man eine Farbe wählen (oder auch nicht, und in diesem Fall werden die Standardfarben angewendet)

Im Fall, dass 2 Datensätze im Diagramm angezeigt werden, kann man für jeden Datensatz eine Farbe wählen:

Und hier ist das Ergebnis:

Ich habe versucht herauszufinden, warum diese Option bisher nicht verfügbar war, aber ich habe keine Begründung gefunden, nur diesen Satz:

In diesem Beitrag:

Ich hoffe also, dass diese Funktion nicht der Philosophie des Projekts schadet (ich habe verstanden, dass die Idee von Gladys ist, hyper einfach zu bleiben).
Die Diskussion ist eröffnet, ich bin gespannt, was jeder von euch dazu denkt.

Eine sehr gute Woche an euch,
Alex.

Salut, merci,

j’avais signalé il y a un moment que le manque de couleur était problématique :
image

Du coup, je suis pour augmenter le nombre de couleur dispo :slight_smile:

Très bonne feature.

Salut @GziAzman !

Trop cool si tu as travaillé sur cette fonctionnalité :slight_smile:

Pour moi c’est sympa ce que tu proposes, et j’ai quelques retours :

  • Plutôt que de mettre « Donnée 1/Donnée 2 », il faudrait mettre le nom de la fonctionnalité affichée
  • Par défaut, sélectionner une couleur différente par fonctionnalité pour que l’utilisateur n’ait à modifier que si il le souhaite
  • En plus de mettre le nom de la couleur, il faudrait mettre un petit carré avec la couleur en prévisualisation , je pense que si tu passe par React-Select (qu’on utilise partout dans Gladys) c’est possible ( React-Select ).

Pas très chaud pour un color-picker, pour moi il faut proposer une liste assez exhaustive de couleur pré-choisie et cohérente entre elles.

Il y a des sites de palettes de couleurs qui existent :

Il faut choisir une palette unique, et ensuite proposer une vingtaine de couleurs max par exemple :slight_smile:

Bonjour à vous, et merci pour vos réponses.

Content de voir que la feature peut plaire, je vais retravailler dessus pour la terminer, et prendre en compte les remarques, après quoi j’ouvrirais une PR.

Concernant les remarques:

Oui, pour être honnête j’avais commencé à vouloir faire ça, mais je trouvais que le « label » devenait trop long avec certains devices. Mais je suis d’accord que ça serait plus clair que la numérotation. Je vais l’implémenter avec le nom, et on en rediscutera.

Yes, par défaut, je n’avais rien mis pour que ça fallback sur les couleurs par défaut. Mais en effet, ça sera peut être plus clair et plus facilement éditable avec ta solution. :ok_hand:

Carrément d’accord, merci pour l’indication du composant à utiliser.

On est aligné là dessus :+1:

Je pense qu’une vingtaine, c’est trop. Déjà, c’est difficile de trouver 20 couleurs bien distinctes. Ensuite, je suis pas sûr que le besoin soit là. Si un graph affiche 20 data différentes, il aura des problèmes de lisibilité qui dépassent la problématique de couleur à mon avis. :sweat_smile:
Qu’en penses-tu si on démarre avec 10 ?

Oui effectivement j’ai dis 20 mais 10 c’est déjà très bien pour commencer ^^

Super fan de cette fonctionnalité, moi qui regarde souvent le graphique de mes températures (où il y a 6 ou 7 capteurs) je m’y perds régulièrement et je joue du clic pour les différencier.

Merci pour ce travail !!!

Bonsoir,

J’ai pris en compte les retours de @pierre-gilles et voilà le résultat:

Et la PR associée:

J’aime beucoup !

Merci pour la PR, super boulot ça rend bien !

Je te fais une review (probablement début de semaine prochaine) et je reviens vers toi :slight_smile:

Merci pour la PR @GziAzman, je viens de review et c’est vraiment très cool :clap:

J’ai 2 petits feedbacks, mais rien de très grave :

Merci @GziAzman pour les correctifs, c’est bon pour moi :slight_smile:

J’ai mergé, ça partira dans la prochaine release de Gladys :rocket:

Trop cool ça !!

Disponible dans Gladys Assistant 4.38.3 :partying_face:

Merci @GziAzman pour ce développement !