Ankündigung

Einklappen
Keine Ankündigung bisher.

Werte meiner Solaranlage in der SmartVisu anzeigen lassen

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    #31
    Zitat von wvhn Beitrag anzeigen
    Deine Lösung könnte ich auf smartvisu-newstuff verlinken, oder auch die die Dateien dort einstellen. Was ist besser?
    für mich wären beide Varianten ok, wie es besser ins smartvisu-newstuff-Konzept passt,..
    Gruß Ivan

    Kommentar


      #32
      ich finde die Lösung von Ivan auch sehr schön!

      Habe heute bei FB in der E3DC Gruppe folgendes Bild gesehen, das wäre auch sehr schön zu haben für SmartVisu...)

      VG
      IMG_2048.JPG

      Kommentar


        #33
        Zitat von wvhn Beitrag anzeigen
        Anders ist es vielleicht bei der Grafik von ivande : hier ist die Anordnung der Elemente knifflig und könnte von einem Widget stabil aufgebaut werden.
        Ja, genau das meine ich mit eigenem Widget.

        So, noch ein paar Anpassungen gemacht. Die Items habe ich bei der Gelegenheit mal komplett auf eval/eval_trigger umgestellt, man kommt also komplett ohne externe Logik aus.

        Den Plot habe ich etwas verschönert.

        Dateien im Anhang.

        Der dramatisch hohe Hausverbrauch (blaue Linie) im Plot zwischen 11:30 und 16:00 kommt übrigens vom Laden des E-Autos mit bis zu 7kW 2-Phasig. PV-Überschuss-geregelt. Klappt super und ist schon sehr interessant, wie die einzelnen Komponenten zusammenspielen. Ladekurve des E-Autos und dessen SoC baue ich velleicht auch noch ein, aber das hat ja nicht direkt was mit der E3DC zu tun.

        Plot.png
        Angehängte Dateien
        Zuletzt geändert von Sipple; 02.09.2020, 20:47.

        Kommentar


          #34
          Kann man eigentlich dem plot.period irgendwie beibringen, dass er die Legende (Im Bild das PV, Akku, Netz, Haus, SoC) nicht mitten in die Grafen platziert sondern oben drüber (über der obersten Linie wäre noch Platz) oder unten drunter (unter den Zeit/Datumsangaben)? Das hat mich schon immer gestört. Nützlich finde ich die schon, weil man mal was ausblenden kann, wenn es sich blöd überlagert.

          Kommentar


            #35
            Prinzipiell kann man dem Widget mit dem Parmeter `chartoptions` noch Optionen für Highcharts mitgeben. In der Doku gibt‘s dazu ein Beispiel. Das Format ist ein JavaScript Objekt, in dem Fall
            Code:
            { yAxis: [ { tickInterval: 0.5 } ], legend: { verticalAlign: 'bottom', y: -30 } }
            Das API ist in der Highcharts Doku sehr gut beschrieben und kann in jsfiddle ausprobiert werden.

            Einfachere Alternative: y-Achse(n) so skalieren, dass oben Platz bleibt.

            Gruß
            Wolfram

            Kommentar


              #36
              Zitat von wvhn Beitrag anzeigen
              Einfachere Alternative: y-Achse(n) so skalieren, dass oben Platz bleibt.
              So habe ich es mit der SoC y-Achse gelöst, das passt so. Aber die andere y-Achse mit den Leistungen skaliert dann ja nicht mehr automatisch. Da müsste ich den Bereich von -11k bis +11k abdecken für alle Fälle und das sieht dann meistens doof aus.

              Mit den Options spiele ich mal rum. Danke dir mal wieder

              Kommentar


                #37
                Ich würde ein schönes Widget bauen, wenn ich blicken würde, wie man jedes einzelne Element innerhalb eines Blocks frei positionieren könnte. Das wären im Prinzip nur standard Widgets innerhalb eines Blocks und das Bild.
                Wird natürlich nochmal komplizierter wenn man bedenkt, dass die Blockbreite variieren kann.
                Bin ich zu alt/zublöd/zu/unwissend. Aber wenn sogar mein Kumpel, der unter anderem mit Webdesign sein Geld verdient, sagt, dass das nicht so einfach ist...

                Beispiel Block.png

                Kommentar


                  #38
                  Im Example3.graphic kannst Du Dir mal ansehen, wie man mit absoluter Positionierung arbeitet. Die ov-widgets (ovbasic...) sind alle mit Angaben der Koordinaten frei positionierbar auf dem Hintergrundbild. Die Widgets unterscheiden sich praktisch nur durch die zusätzlichen Positionsangaben von den Original-Widgets.
                  Da Du nur wenige Elemente absolut positionieren musst, würde ich empfehlen, dies manuell zu machen und nicht auf die ov-widgets zurückzugreifen.

                  P.S.: Gegen das Alter kann man damit nicht ankommen, aber gegen die Unwissenheit (weiß ich aus eigener Erfahrung)

                  Kommentar


                    #39
                    Neu! Jetzt mit Legende unten:

                    Legende_unten.png


                    Weiter runter geht nicht, sonst verschwindet die Legende, schon vor dem Blockende. Und der Block wird nicht automatisch höher.
                    Das kommt schon nahe an das ran, was ich mir vorgestellt habe. Ich glaube, so lass ich das mal eine Weile.
                    Zuletzt geändert von Sipple; 03.09.2020, 14:55.

                    Kommentar


                      #40
                      Zitat von wvhn Beitrag anzeigen
                      Da Du nur wenige Elemente absolut positionieren musst, würde ich empfehlen, dies manuell zu machen und nicht auf die ov-widgets zurückzugreifen.
                      Wie diese OV Widgets genau funktionieren habe ich eh nicht kapiert. Also bin ich ganz naiv so vorgegangen:

                      In die visu.css mal zum Testen sowas reingeschrieben:

                      Code:
                      /**
                       * -----------------------------------------------------------------------------
                       * @package     smartVISU
                       * @author      Martin Gleiß
                       * @copyright   2012 - 2015
                       * @license     GPL [http://www.gnu.de]
                       * -----------------------------------------------------------------------------
                       */
                      
                      /**
                       * This file is for your own stylesheets.
                       */
                      
                      @CHARSET "UTF-8";
                      
                      /* display background only on larger displays */
                      @media all and (min-width: 6000px) {
                      .page-bg {
                      background-image: url('../../pics/bg/luminous_lines.png');
                      }
                      }
                      
                      #E3DC_box1 {
                      background-color: green;
                      width: 100px;
                      height: 100px;
                      position: absolute;
                      top: 10px;
                      left: 10px;
                      }
                      Diese visu.css in meinem pages Ordner sollte doch automatisch geladen bzw. referenziert werden?

                      Wenn ich aber dann in Testweise so ein Konstrukt in eine Seite baue, passiert schlicht gfar nichts, außer dass der Text unter das Bild geschrieben wird. Als ob das css nicht geladen würde.

                      Code:
                          <div class="block">
                              <div class="set-1" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
                                  <div data-role="collapsible" data-collapsed="false">
                                      <h3>E3DC Energiefluss</h3>
                                        <img style="height: 512px; vertical-align: middle;" src="icons/MINI_big.png">
                                          <div id="E3DC_box1">
                                              hier kommt der 1. Inhalt
                                          </div>
                                  </div>
                              </div>
                          </div>
                      Analyse mit Firefox F12 etc. hat mir auch nichts gebracht. Da werden Laien wie ich nur erschlagen von einer Informationsflut.

                      Kommentar


                        #41
                        Vergessen wir mal css. So geht zumindest ein bisschen was.

                        Code:
                            <div class="block">
                                <div class="set-1" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
                                    <div data-role="collapsible" data-collapsed="false">
                                        <h3>E3DC Energiefluss</h3>
                                        <img style="height: 512px; vertical-align: middle;" src="icons/MINI_big.png">
                                        <div style="position: absolute; left: 70%; top: 50%;">
                                            <div style="border: dotted red 3px;">
                                                {{ basic.icon('control_building_empty.svg') }}
                                                {{ icon.meter('OV_Haus_Icon', '', 'E3DC.Leistung.Haus', 0, 12000) }}
                                                {{ basic.print('OV_Leistung_Haus', 'E3DC.Leistung.Haus', 'w') }}
                                                <br />
                                                Ich mach nicht was ich soll.
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        Ich kann die Testbox leidlich gut positionieren, aber der Referenzpunkt ist die ganze Bildschirmseite. Bin davon ausgegangen, dass sich das an dem Block orientiert.
                        Das bedeutet jetzt, dass die Positionierung keinen Sinn macht, weil beim Verändern des Browserfensters dann alles sonstwo auftaucht.
                        Was allerdings funktioniert ist die Collapsible Eigenschaft. Damit verschwindet auch die Testbox, so wie es sein soll. Wenn ich also den Referenzpunkt für die Position noch auf den umgebenden Block setzen könnte, wäre der Rest wohl machbar. Ist da oben ein offensichtlicher Fehler drin oder wer weiß wie das geht?

                        Danke im Voraus

                        Martin

                        Kommentar

                        Lädt...
                        X