Chart Block

[Tommy Herrmann]

Habe jetzt noch für mich die CSS am Handy etwas geändert, da die Grafik sonst in der Breite nicht auf das Display passt:

https://www.mobirise-tutorials.com/Vorlageseite/#chart

width: 90% !important;

Code: Alles auswählen

@media (max-width: 767px) {
  .chart-wrapper {
    width: 90% !important;
    padding: 12px !important;
    border-radius: 12px !important;
  }
  .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .cust-chart-btn {
    width: 50%;
    margin: auto;
    font-size: 0.85rem;
  }
  .chart-btn-row {
    flex-direction: column;
  }
}

[Volker]

CSS ist einfach nicht mein Ding

[Tommy Herrmann]

jetzt ist bei mir - ohne dass ich irgend etwas gemacht hätte - die QuickChart URL weg. Das Feld ist leer und ich kann entsprechend auch nicht auf den "refresh" Button klicken:

https://quickchart.io/chart?v=3&bkg=%23 ... 8044710882

[Volker]

Di kostenlose API hat nur 60 Einblendungen pro Minute glaub ich, kann sein das Du zu oft geklickt hast ?

[Tommy Herrmann]

Jetzt habe ich die Erweiterung darunter nochmals aufgezogen und danach war die QuickChart URL auch wieder in meinem ursprünglichen Block da

[Tommy Herrmann]

Nun, nach längeren Tests muss ich leider feststellen, dass der Chart-Block nicht funktioniert. Schließe ich Mobirise ist die Chart Anzeige bei mir weg und auch nicht durch Klicken auf den Button "Aktualisieren" wieder herzustellen.

Füge ich nun diese Erweiterung unter dem ersten Block erneut ein, dann wird die URL auch wieder dargestellt und somit die Anzeige vom Chart.

Der nun eingefügte zweite Block ist aber gar nicht zu bearbeiten.

Chart zwei Mal funktioniert nicht.jpg

Insofern lösche ich diese Anwendung erst mal wieder.

[Volker]

Hallo Tommy,

stimmt ich hab das Problem auch gerade gesehen.

Bitte teste nochmals die nun neue mbrext ich hab einiges geändert - bzw. die KI das Java Script anpassen lassen.
Ich habe es jetzt ein paar mal getestet. Hatte immer ein Bild in Mobirise.
Vergess es !!

Geht auch nicht sehe ich gerade - da muss ich nochmal gucken

[Volker]

Ich hab jetzt eine Version online die abgespeckter ist Tommy,
probier die bitte mal. Da habe ich jetzt mit getestet die geht.



https://www.niederastroth.de/chartadmin.html

Wenn die bei Dir OK ist werde ich die nach und nach wieder erweiteren, da fehlen jetzt ein paar Dinge, wo ich nicht sicher bin ob es daran liegt- aber ich vermute

[Volker]

Hier nochmals eine Vollversion die sollte jetzt genau so funktionieren :

Bitte teste die doch auch mal Tommy und gib mir bescheid ob der jetzt rund ist

https://www.niederastroth.de/chartsvollversion.mbrext

[Volker]

Also,

es liegt an Mobirise - wie immer

Die Erweiterung mit 6 Farben und mit weniger Schnick Schnack läuft bei mir, es ist immer eine Grafik zu sehen in Mobirise auch nach Neustart. Siehe Video oben.

Bei allen Änderungen im Script was auch die URL länger macht, hat Mobirse wohl ein Problem, was ich aber nicht genau benennen kann. Egal ob ich 7,8 oder 10 Farben rein haue- nach Neustart kein Bild. Auch andere Änderungen werden sofort mit einem broken image bestraft und auch ein Reset ist nicht möglich.

Der 6 Farbige Block dagegen ist zu 100% immer mit Bild da in Mobirise. Also lasse ich den jetzt mal so.

Also die Erweiterung auf meiner Seite: https://www.niederastroth.de/chartadmin.html ist der 100% laufende.
Der mit mehr Farben usw. läuft zwar auch, aber wird in Mobirise nach Neustart dann nicht angezeigt. Entweder die Vorschau nutzen oder eben den anderen sicheren Block nutzen.

[Tommy Herrmann]

Ich gucke morgen nochmal

[Tommy Herrmann]

Ich teste das etwas später am Vormittag.

Dein Beispiel läuft aber hier gerade am Handy eben nicht 100% korrekt. Sollte das jetzt so in der aktuellen .mbrext Datei sein, brauche ich nicht testen.

Es dauert einen Moment bis die Chart Grafik dargestellt wird. In dieser Zeit wird der Block unschön klein (niedrig, siehe Screenshot) und mit einem Broken-Image Symbol dargestellt. Dadurch "hüpft" dann auch die gesamte Seite unschön.

Der Block müsste also zunächst geladen werden und erst danach angezeigt werden oder es müsste in der Zeit des Ladens ein Platzhalterbild erscheinen, wie z.B. ein Laden-GIF.

Für mein Empfinden sieht das jetzt fehlerhaft aus und kann so nicht bleiben.

Screenshot_20260507_072952_Samsung Browser.jpg

[Volker]

[Tommy Herrmann]

Moin,

ja - das ist doch bei Dir ganz genauso. Siehst Du das denn nicht. Unten mal ein Screenshot von Deinem Video:

Volkers Video mit Broken Image und verkleinertem Rahmen.jpg

... oder hier am Firefox-Browser, dort wird das Broken-Image nicht angezeigt - am Edge und Chrome - Browser schon:

Volkers Chart-Seite mit Broken Image und verkleinertem Rahmen.jpg

[Volker]

Ja Tommy sehe ich

1 Sekunde ist das broken Image zu sehen aber es kommt doch dann sofort die Grafik. Klar dauert das eine Sekunde bis die erscheint. Wo ist denn da das Problem ?

[Tommy Herrmann]

Es geht auch weniger darum, dass das eine unschöne Darstellung ist, denn diese ist ja nur sehr kurz, weniger als 1 Sekunde, es geht vielmehr darum, dass das ein Programmierfehler ist.

An dieser Stelle darf zu keiner Zeit ein "Broken-Image-Symbol" erscheinen und der Chart-Rahmen muss auch immer die Größe des Charts haben, ansonsten springt die gesamte Seite beim Laden.

[Volker]

Naja ob das ein Fehler ist lass ich mal so stehen

Auf meiner Webseite oben werden auch Inhalte dynamisch eingeladen, das springt es auch wenn Du so willst.
Wenn Du das als störend empfindest - OK. Dann kannst Du ein Platzhalterbild einbauen, aber dann hast Du eben auch nicht mehr die Möglichkeit in Mobirise die Änderungen der Live Grafik zu sehen. Die würde dann erst online kommen und das Platzhalterbild ersetzen. Ist die 2. Möglichkeit - Beides geht eben nicht.

Ah habs gerade getestet, geht sogar mit Platzhalterbild. Einmal da rein und bei aktualisieren kommen dann in mobirise die richtigen Grafiken. Beim Veröffentlichen wird aber dann immer érst das Paltzhlater Bild angezeigt. Geht also auch

[Tommy Herrmann]

glaube schon, dass beides geht. Das Platzhalterbild sollte sich der Größe des Diagramm-Rahmens automatisch anpassen, es sollte also ca. 2000px Breite haben.

Ich teste mal noch etwas ...

[Volker]

hab jetzt ein Bild vorher da stehen - Größe stimmt jetzt zwar nicht aber ist mir jetzt auch egal

https://www.niederastroth.de/chartadmin.html

[Tommy Herrmann]

Ja - also - die Anwendung funktioniert, solange ich nichts ändere. Wenn ich z.B. ein Bild von Mobirise als Platzhalter einsetze oder den Rahmen von gestrichelt in solide im CSS ändere und dann Mobirise neu starte, funktioniert nichts mehr.

Ich lasse das jetzt mal weg.