# Verbesserung der Grafiken

**URL:** <https://community.gladysassistant.com/t/amelioration-des-graphiques/8954>\
**Category:** Développement\
**Created:** [23. Mai 2024 um 20:51 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954 "2024-05-23T20:51:31Z")\
**Posts on this page:** 20\
**Page:** 7

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [29. August 2024 um 14:47 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/121 "2024-08-29T14:47:48Z")

</div>

Hey !!

Genau dabei bin ich gerade, den Neustart nach der v4.45 zu starten ^^.  
Ich habe vor 15 Minuten den ersten PR wieder geöffnet (ich fange mit den Binärdateien an, falls das für dich okay ist), ich bringe mich bei DuckDB auf den neuesten Stand und sehe mir die neue Funktionsweise an und antworte dir dann!!

Was diese PR genau betrifft … dieser kleine Punkt hat mich tatsächlich eine Menge Zeit gekostet … Ich bin ehrlich … ich habe es nicht geschafft … Achte ich nicht auf deinen speziellen Punkt. Für mich scheint der Code drumherum nicht gut zu sein. Aber ich muss mich wieder damit beschäftigen und wir können dann darüber sprechen, falls das für dich okay ist.

Möchtest du, dass ich diese zuerst priorisiere oder die Binärdateien?

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [29. August 2024 um 14:49 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/122 "2024-08-29T14:49:47Z")

</div>

> [@Terdious](#):
>
> Was genau diese PR angeht … dieser kleine Scheiß hat mich echt ewig Zeit gekostet … Ich sag’s mal offen … ich hab’s nicht geschafft … Aber ich rede nicht speziell über deinen Punkt. Für mich sieht der Code drumherum nicht gut aus. Aber ich muss mich da nochmal reinfuchsen und dann können wir drüber reden, wenn du willst.

Was schaffst du nicht?

> [@Terdious](#):
>
> Willst du, dass ich das hier zuerst mache oder die Binärdateien?

Wie du willst, aber für mich ist das hier wirklich richtig richtig cool für wenig Arbeit, ist hyper einfach ^^ Ich denke, das hier kann viel schneller gemerged werden als die Binärdateien

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [29. August 2024 um 15:06 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/123 "2024-08-29T15:06:26Z")

</div>

> [@pierre-gilles](#):
>
> Wie du willst, aber für mich ist das wirklich sehr sehr cool für sehr wenig Arbeit, es ist hyper einfach ^^ Ich denke, dass das viel schneller gemerged werden kann als die Binärdateien

Oki !! (auch wenn die Binärdateien, soweit ich mich erinnere, nur ein Anzeigeproblem auf dem Handy hatten ^^) aber das ist okay für mich ^^

> [@pierre-gilles](#):
>
> Was kannst du nicht machen?

Ich schaue mal ^^ Aber soweit ich mich erinnere, ging es um die Verwaltung der Anzeige der Dropdown-Menüs oben und unten im mobilen Modus aufgrund der Änderungen in der Verwaltung der Dynamik der Spalten … aber ich habe gerade die Tests mit meinen Änderungen von Juni durchgeführt und habe das Problem nicht …  
Ein Problem mit der Position / dem Überlauf …

Es ist kompliziert, zu viel Zeit verstreichen zu lassen !!^^

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [29. August 2024 um 16:44 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/124 "2024-08-29T16:44:20Z")

</div>

Ok, alles klar, ich habe es wiedergefunden.

Als ich die von dir gewünschte Änderung vorgenommen habe (nichts Großartiges von Grund auf ^^), habe ich etwas umfangreichere Tests durchgeführt und bin auf folgendes Problem gestoßen:

- Ich habe `overflow: hidden;` im Stil der Spalten verwendet, um bei der Verkleinerung des Bildschirms gut kalibrierte Spalten zu erhalten.  
 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/3/f/3ffd6845f25c3cfca7e0181661b85f45fbe85614.png)  
Dadurch entsteht jedoch folgendes bei den Widgets „Geräte im Raum“ und „Geräte“:  
 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/c/d/cde1f599316cd6f0a2b2909a2525318cd85ade73.png)  
(das Widget überschreitet die Höhe der Spalte und das „hidden“ versteckt den Überstand.  
 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/4/f/4faf698a56f999e6da6438ef9d4cf0eebaf0649f.png)

Ich versuche, es zu entfernen, aber dann sind die Spaltenabmessungen bei der Verkleinerung des Bildschirms nicht mehr korrekt …  
 ![addcolumnbug-ezgif.com-optimize](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/b/5/b5dd2ac4e06459e0301885eb66f071c8272fad45.gif)

Ich habe den Code so gepusht und auf 4.45 aktualisiert, du sagst mir, was du davon hältst? ^^ …

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:02 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/125 "2024-08-30T08:02:31Z")

</div>

@Terdious Ich habe deinen Branch gepullt, ich glaube, der Button zum Hinzufügen von Widgets fehlt:

 ![Screenshot 2024-08-30 at 09.58.26](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/a/c/ac20c78f9e474f4ca496c5fac652045496ccc781.png)

Ich verstehe nicht ganz den Sinn von overflow:hidden, damit soll man doch eigentlich die Breite der Spalten verwalten, oder? 🤔

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [30. August 2024 um 08:12 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/126 "2024-08-30T08:12:21Z")

</div>

Argh !! Tatsächlich, eine Änderung, die ich nicht zurückgesetzt hatte !! Es ist push, sie sind wieder da! Entschuldigung

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:18 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/127 "2024-08-30T08:18:26Z")

</div>

> [@Terdious](#):
>
> Ich versuche, es zu entfernen, aber dann sind die Spaltenbreiten bei der Bildschirmverkleinerung nicht mehr korrekt …

Ich versuche, es nachzustellen, aber selbst ohne overflow:hidden funktioniert es

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [30. August 2024 um 08:20 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/128 "2024-08-30T08:20:40Z")

</div>

> [@pierre-gilles](#):
>
> Ich verstehe nicht ganz den Sinn von overflow:hidden, damit soll man doch eigentlich die Breite der Spalten verwalten, oder? 🤔

Ich gebe ehrlich zu, dass ich es auch nicht verstanden habe!!

Das Problem tritt nicht auf (ohne `overflow:hidden`) bei einem neuen, leeren Dashboard:

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/e/8/e883457b2a7550ca273f2d32475317d6cc421709.png)

Aber wenn man die Spalten zum Beispiel mit einer Grafikbox füllt, die die Spaltenbreite leicht vergrößert, beginnt man zu sehen, dass die dritte Spalte kleiner wird als die beiden anderen:

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/6/c/6c121a6939ad13d36ba1214a3fade55e4f962229.png)

et wenn man weitermacht:

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/4/5/4544e4fe4f19feaa5d345c1142d45ec5b0525f13.png)

Wenn ich den CSS `overflow:hidden` einstelle (offensichtlich eine Idee von ChatGPT, denn meine Recherchen ergaben nichts), löst das zwar das Problem, aber es verursacht ein Problem am unteren Rand der Seite ^^

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [30. August 2024 um 08:21 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/129 "2024-08-30T08:21:27Z")

</div>

> [@pierre-gilles](#):
>
> Ich versuche es zu reproduzieren, aber selbst ohne overflow:hidden funktioniert es

Voll mit Boxen ^^ und gefüllt ^^

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:24 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/130 "2024-08-30T08:24:47Z")

</div>

Entschuldige, ich habe es bis zum Maximum ausgefüllt, es funktioniert perfekt ^^ Hast du noch einen Tipp, wie ich es reproduzieren kann?

Ich bin auf Chrome

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:26 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/131 "2024-08-30T08:26:13Z")

</div>

Okay, ich habe verstanden, der Fehler tritt nur auf Französisch auf

Ich war auf Englisch

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [30. August 2024 um 08:26 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/132 "2024-08-30T08:26:42Z")

</div>

Raaaa ^^ aber ja, längere Sätze

Ich habe gerade weitere Tests durchgeführt, ich glaube, es sind alle Boxen, die React-Tools verwenden!! (Zumindest scheint es auf den ersten Blick so zu sein, dass es sich um `import Select from 'react-select';` handelt)

Ich habe Probleme mit den Boxen:

- Geräte
- Geräte im Raum
- Grafiken

Und das war’s.

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:32 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/133 "2024-08-30T08:32:45Z")

</div>

Ich denke, dass der Breakpoint ohnehin zu niedrig ist. 992px sind winzig, um in die vertikale Ansicht zu wechseln. In drei Spalten sieht man überhaupt nichts, es ist ohnehin nicht nutzbar.

Ich habe es mit Folgendem getestet:

```auto
@media (max-width: 1280px) {

```

Und das löst das Problem auf Französisch 🙂

Dadurch wechselt die Ansicht ab 1280px in die vertikale Darstellung, was ich viel realistischer finde.

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:33 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/134 "2024-08-30T08:33:59Z")

</div>

Bei so etwas ist ChatGPT meiner Meinung nach ziemlich dumm, es gibt nur hackige und schnell zusammengeschusterte Lösungen, wo man eigentlich nur mal in Ruhe nachdenken und das Ganze neu überlegen müsste 🙂

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:34 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/135 "2024-08-30T08:34:53Z")

</div>

(Ich präzisiere, dass 1280px nicht zufällig gewählt ist, das ist im von uns verwendeten Theme der Breakpoint XL)

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [30. August 2024 um 08:41 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/136 "2024-08-30T08:41:12Z")

</div>

> [@pierre-gilles](#):
>
> Bei diesem Problem finde ich ChatGPT ziemlich dumm, es gibt nur hacky und schnell zusammengeschusterte Lösungen, wo man sich eigentlich nur hinsetzen und das Ding neu überdenken muss 🙂

Total zustimmung !!

Aber mit den drei oben genannten Boxen habe ich immer noch das Problem … :

> [@Terdious](#):
>
> Ich habe das Problem mit den Boxen:
> 
> - Geräte
> - Geräte im Raum
> - Grafiken

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/4/a/4a3c60535d39d28fe41ac752688fc23f581f1a55.png)

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:42 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/137 "2024-08-30T08:42:58Z")

</div>

> [@Terdious](#):
>
> Aber mit den drei genannten Boxen habe ich immer noch das Problem … :

Das muss daran liegen, dass der Titel der Funktion „MQTT-Gerät (MQTT-Temperaturfunktion)“ extrem lang ist.

Man muss überprüfen, ob dieser Typ von Titel auch umbricht, wenn er zu lang ist.

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:46 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/138 "2024-08-30T08:46:14Z")

</div>

![Screenshot 2024-08-30 at 10.45.59](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/e/5/e5d97fad37c3b4451a62167a511fc3f034c83c6f.png)  
Seltsam, ich habe das Problem eigentlich nicht.

---

<div class="post-metadata">

**Author:** ![Terdious](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/terdious/32/6316_2.png) [@Terdious](https://community.gladysassistant.com/u/Terdious)\
**Post date:** [30. August 2024 um 08:51 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/139 "2024-08-30T08:51:53Z")

</div>

Ich habe ihn rausgeschmissen, aber nein ^^

 ![image](https://gladys-assistant-community.b-cdn.net/uploads/default/original/3X/8/f/8f0a42b48d58ca43f26d80fffee860d35437a130.png)

Es passiert wirklich, sobald du eine der drei genannten Boxen in eine Spalte setzt und nicht in eine andere und du Geräte ausgewählt hast. Aber wenn ich sie entferne (nur die ausgewählten Funktionen, die ich aus der Box entferne), gleicht es sich wieder aus…

Es ist schwer reproduzierbar, aber ich habe es mehrmals mit verschiedenen Konfigurationen gemacht!!

---

<div class="post-metadata">

**Author:** ![pierre-gilles](https://gladys-assistant-community.b-cdn.net/user_avatar/community.gladysassistant.com/pierre-gilles/32/5886_2.png) [@pierre-gilles](https://community.gladysassistant.com/u/pierre-gilles)\
**Post date:** [30. August 2024 um 08:53 UTC](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954/140 "2024-08-30T08:53:26Z")

</div>

> [@Terdious](#):
>
> Du hast ausgewählte Geräte. Aber wenn ich sie entferne (ich entferne nur die ausgewählten Funktionen von der Box), dann gleicht sich das wieder aus …

Tut mir leid, aber bei mir tritt das nicht auf ^^ alles funktioniert!

[Vorherige Seite](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954.md?page=6)

[Nächste Seite](https://community.gladysassistant.com/t/amelioration-des-graphiques/8954.md?page=8)
