Mehrere Variablen in eine SVG-Grafik übergeben

[Robosoc]

Moin,

ich habe folgende Frage schon im Timberwolf-Forum gepostet, aber da Chris schon mehrmals darauf hingewiesen hat, dass manin diesem Forum mehr wissende Personen zur CometVisu anspricht, wollte ich mein Gluck mit dem Post hier noch einmal erhöhen...ich spiele aktuell inzwischen recht viel mit CSS und auch den SVG's rum und werde demnächst auch mal eine abgewandelte Design-Vorlage posten.

Im Moment würde es mir sehr helfen, wenn ich mehrere Variablen aus dem KNX Bus an eine SVG übergeben könnte um die Grafik zu verändern. Bei meinen Tests nutze ich im Moment einfach die Füllstandsdemo von Chris (demo_2d_backdrop_red_pot.svg):


Ich habe es mit verschiedenen Ideen versucht u.A. Folgendes mit ThatGA als zweite Variable, aber leider ohne Erfolg:

var qx = window.parent.qx;
var cv = window.parent.cv;

var backendName = cv.Config.configSettings.backend || cv.Config.backend;
var
  thisGA = '1/7/51',
  thisTransform = 'DPT:9.002',
  thatGA = '1/7/52',
  thatTransform = 'DPT:9.002',
  client = cv.Application.createClient(backendName, cv.Config.backendUrl);

client.update = function(json ) // overload the handler
{
  var h = cv.Transform.decode(thisTransform, json[thisGA] );
  if (h === undefined || isNaN(h)) {
    return;
  }
  var w = cv.Transform.decode(thatTransform, json[thatGA] );
  if (w === undefined || isNaN(w)) {
    return;
  }
  var filling = document.querySelector('#rect3855');
  filling.y.baseVal.value=200.57388 + (100-h*2*100)*2;
  filling.height.baseVal.value = h*2*100*2;
  document.querySelector('#path3029-4').setAttribute('d', 'm 524.85653,'+(200.57388+ (100-h*2*100)*2)+' a 100,37.795274 0 0 1 -200,0 100,37.795274 0 1 1 200,0 z');
};
 
client.user = 'demo_user'; // example for setting a user
client.subscribe( [thisGA] );
client.subscribe( [thatGA] )
#

Wobei hier die folgenden Zeilen als Versuch hinzugefügt wurden:
oben

  thatGA = '1/7/52',
  thatTransform = 'DPT:9.002',

mitte

  var w = cv.Transform.decode(thatTransform, json[thatGA] );
  if (w === undefined || isNaN(w)) {
    return;
  }

unten

  client.subscribe( [thisGA , thatGA] )

Der Firefox wirtft eine Fehlermeldung aus und durch rumtesten würde ich vermuten, dass dies durch die mittlere Einfügung entsteht...hätte jemand eine Idee?
Hier die Fehlermeldung:
Anmerkung 2020-02-25 070732.jpg

Und falls es interessiert, was ich gerne machen will. Im ersten Step versuche eine Heizkurven-Visualisierung zu realisieren: Sie Screenshot von der bereits fertigen SVG unten. Die Kurve wäre dann später auch tasächlich noch gekrümt und würde durch min- und maxwerte begrenzt sein, daher denke ich im Moment so an 5 - 7 Parameter, die ich gerne übergeben würde - nämlich alle Parameter die ich auch in der Berechnung der Vorlauftemperatur in der Logik nutze. Aber wenn man die Syntax für zwei Parameter endlich hat, sollten ja auch mehr möglich sein...

Anmerkung 2020-02-26 222758.jpg


VG, Sven

[Robosoc]

Mist, habe diesen Post hier gerade exakt dann gesendet, als Chris im Timberwolf-Forum geantwortet hat...

Wenn jemand Interesse an dem Thema hat, dann schaut gerne hier in die Diskussion ab Beitrag #4:

https://forum.timberwolf.io/viewtopi...p=21930#p21930

[Robosoc]

Falls sich jemand dafür interessiert und durch die Suche auf dieses Topic stößt...Das Resultat ist hier vorgestellt und es werden dort erfolgreiche 6 KNX-Werte in einer SVG verarbeitet: https://forum.timberwolf.io/viewtopi...izkurve#p22095