nicht angemeldet
Das, was du im folgenden beschreibst, ist ein Darstellungsproblem. So, wie du es beschreibst, versuchst du, die Darstellung einer alternativen Ausgabe in ein Korsett, dass für eine andere Ausgabe erdacht wurde, hineinzupressen.
Ja.
Grundsätzlich gilt, wir können nichts zu etwas sagen, das wir nicht kennen. Das gilt auch für deinen uns unbekannten Code. s. U.
Allerdings möchte ich dich anregen, etwas genereller über die Aufgabe nachzudenken. OK
Ist dir das EVA-Prinzip (nicht das Buch) bekannt?
eigentlich Ja.
Konkreter geht es nur mit einem Blick auf den vorhandenen Code.
Ich versuch's mal: Hier der Auswahl-Teil, Also das E.
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" href="style.css">
<title>Heiz-Info Sync</title>
<h1>Unsere Heizung xi</h1>
</head>
<body>
<form action="sync_dia.php" method="post">
<!--form action="" method="post" -->
Welche Daten:
<br>
<table>
<input type="radio" id="DG" name="etage" value="DG">
<label for="DG"> Dachgeschoss</label>
<input type="radio" id="OG" name="etage" value="OG">
<label for="OG"> Obergeschoss</label>
<input type="radio" id="EG" name="etage" value="EG" checked="checked">
<label for="EG"> Erdgeschoss</label>
<input type="radio" id="KG" name="etage" value="KG">
<label for="KG"> Kellergeschoss</label>
<input type="radio" id="wa" name="etage" value="wa" disabled >
<label for="wa"> Wasser</label>
</table>
<br><br>
Welche Zeitspanne:
<br>
<table>
<input type="radio" id="t" name="zeit" value="t">
<label for="t"> 1 Tag </label>
<input type="radio" id="d" name="zeit" value="d" checked="checked">
<label for="d"> 3 Tage </label>
<input type="radio" id="w" name="zeit" value="w">
<label for="w"> 1 Woche </label>
<input type="radio" id="m" name="zeit" value="m">
<label for="m"> 1 Monat </label>
<input type="radio" id="j" name="zeit" value="j" disabled >
<label for="j"> 1 Jahr </label>
</table>
<br><br>
Welche Darstellung:
<br>
<table>
<button name="darst" value="dia"> Diagramm </button>
<button name="darst" value="tab"> Tabelle </button>
</table>
<br>
</form
</body>
</html>
Und jetzt das V in php und das A in javascript (nur für Diagramm, Tabelle fehlt), eingebettet in HTML.
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" href="style.css">
<title>syncro</title>
<h1>Unsere Heizung xi</h1>
<script type="text/javascript" src="/dygraph/dygraph-combined-dev.js"></script>
<script type="text/javascript" src="/dygraph/synchronizer.js"></script>
<script type="text/javascript" src="/dygraph/data.js"></script>
<!-- Definitionen -->
<style>
.chart_temp { width: 1500px; height: 300px; }
.chart_digi { width: 1500px; height: 150px; }
.chart-container { overflow: hidden; }
.legende {}
#diagramm1 { float: left; border: 3px; }
#diagramm2 { float: left; border: 3px; clear: left }
#diagramm3 { float: left; border: 3px; clear: left }
#legende1 { float: left; border: 3px; }
#legende2 { float: left; border: 3px, }
#legende3 { float: left; border: 3px, }
</style>
</head>
<body>
<?php
$etage = $_POST["etage"]; // DG OG EG KG Wa
$zeitraum = $_POST["zeit"]; // t(ag) d(3tage) w(oche) m(onat) j(ahr)
$darstellung = $_POST["darst"]; // dia(gramm) tab(elle)
include 'dbconnect.php';
$connection = mysqli_connect($MyHostname, $MyUsername, $MyPassword, $mysql_db) or die("Verbindung zur Datenbank fehlgeschlagen.");
// ----------------------------------------------------------------------------------------
// ETAGE-Auswahl - LABEL erzeugen - SPALTEN ermitteln
// etage = DG, OG, EG, KG, Wa, Ha??, He??
// bez = Kurzbezeichnung max. 4 Zeichen
// name = Lang-Bezeichnung max. 20 Zeichen
// art = z. Zt. Raum, FBH, Aussen, Solar, Speicher
// Solltemp = Solltemperatur, nur bei Raum, sonst 0 (Null)
$abfrage_etage = "SELECT bez, name, art, solltemp
FROM $tab_sens
WHERE (etage = '$etage')";
$ergebnis_etage = mysqli_query($connection, $abfrage_etage);
if (!$ergebnis_etage) die ("Fehler in Abfrage Etage: <br>(". mysqli_connect_errno() .")". mysqli_connect_error() . "<br>"); // Fehlerinfo
$spalten_raum = "";
$spalten_fbh = "";
$label_temp = "[\"date\"";
$label_fbh = "[\"date\"";
$label_digi = "[\"date\"";
$n_raum = 0;
$n_fbh = 0;
while ($row_sens = mysqli_fetch_array($ergebnis_etage)) {
if ($row_sens[art] == "Raum") {
$array_raum[$n_raum] = $row_sens[bez];
$spalten_raum .= ", ".$row_sens[bez]."T, ".$row_sens[bez]."S, ".$row_sens[bez]."D";
$label_temp .= ", \"".$row_sens[name]."\", \"".$row_sens[name]." Soll\"";
$label_digi .= ", \"".$row_sens[name]."\"";
$n_raum += 1;
}
elseif ($row_sens[art] == "FBH") {
$array_fbh[$n_fbh] = $row_sens[bez];
$spalten_fbh .= ", ".$row_sens[bez]."T";
$label_fbh .= ", \"".$row_sens[name]."\"";
$n_fbh += 1;
}
//elseif ($row_sens[art] == "xxx") { // Speicher, Solar, Aussen ??????
//}
}
$label_temp .= "]";
$label_fbh .= "]";
$label_digi .= "]";
// ----------------------------------------------------------------------------------------
// ZEIT-Auswahl
$time = time();
$tag = 24*60*60;
switch ($zeitraum) {
case "t":
$start = $time - $tag;
break;
case "d":
$start = $time - (3 * $tag);
break;
case "w":
$start = $time - (7 * $tag);
break;
case "m":
$start = $time - (30 * $tag);
break;
case "j":
$start = $time - (90 * $tag);
break;
}
$start = date('Y-m-d H:i:s',"$start <br>");
// ----------------------------------------------------------------------------------------
// Daten-abfrage
// Sortierung geht nur normal/aufsteigend
$abfrage_raum = "SELECT DATE_FORMAT(zeit_ardu, '%Y/%m/%d %H:%i:%s') AS date, zeit_ardu $spalten_raum
FROM $tab_temp
Where (zeit_ardu >= '$start')
ORDER BY date";
$ergebnis_raum = mysqli_query($connection, $abfrage_raum);
$str_temp = "[ ";
$str_digi = "[ ";
while($row = mysqli_fetch_array($ergebnis_raum)) { // $row ist ein assoziatives Zeilen-Array
$str_temp .= "["." new Date(\"".$row[date]."\")";
$str_digi .= "["." new Date(\"".$row[date]."\")";
for ($i = 0; $i < $n_raum; $i++) {
$stst = $array_raum[$i];
$str_temp .= ", ".$row[$stst."T"].", ".$row[$stst."S"];
$str_digi .= ", ".($row[$stst."D"] + ($n_raum - 1 - $i));
}
$str_temp .= " ], ";
$str_digi .= " ], ";
}
$str_temp .= " ]";
$str_digi .= " ]";
$abfrage_fbh = "SELECT DATE_FORMAT(zeit_ardu, '%Y/%m/%d %H:%i:%s') AS date, zeit_ardu $spalten_fbh
FROM $tab_temp
Where (zeit_ardu >= '$start')
ORDER BY date";
$ergebnis_fbh = mysqli_query($connection, $abfrage_fbh);
$str_fbh = "[ ";
while($row_fbh = mysqli_fetch_array($ergebnis_fbh)) { // $row ist ein assoziatives Zeilen-Array
$str_fbh .= "["." new Date(\"".$row_fbh[date]."\")";
for ($i_fbh = 0; $i_fbh < $n_fbh; $i_fbh++) {
$stst = $array_fbh[$i_fbh];
$str_fbh .= ", ".$row_fbh[$stst."T"];
}
$str_fbh .= " ], ";
}
$str_fbh .= " ]";
?>
<!-- ENDE PHP --- BEGINN JAVASCRIPT -->
<div class="chart-container">
<!-- Achtung Reihenfolge => Anordnung -->
<div id="diagramm1" class="chart_temp"></div>
<div id="legende1" class="legende"></div>
<div id="diagramm2" class="chart_temp"></div>
<div id="legende2" class="legende"></div>
<div id="diagramm3" class="chart_digi"></div>
<div id="legende3" class="legende"></div>
</div>
<script type="text/javascript">
<!-- AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA -->
gA = new Dygraph(
document.getElementById("diagramm1"),
<!-- Daten -->
<?php echo $str_temp; ?> ,
<!-- Optionen -->
{
title: 'Raumtemperaturen - <?php echo $etage; ?>',
rightGap: 20, //rechter Rand
// Legende
labelsDiv: document.getElementById('legende1'),
labelsSeparateLines: true,
labelsKMB: NaN,
legend: 'always',
labels: <?php echo $label_temp; ?>,
// Achsen
ylabel: 'Temperatur (C)',
connectSeparatedPoints: NaN,
colors: ['red', 'red', 'blue', 'blue', 'green', 'green', 'orange', 'orange', 'yellow', 'yellow'],
strokeWidth: [2, 4],
//pointSize: 3,
// RangeSelector
showRangeSelector: true
}
);
<!-- BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB -->
gB = new Dygraph(
document.getElementById("diagramm2"),
<!-- Daten -->
<?php echo $str_fbh; ?> ,
<!-- Optionen -->
{
title: 'Fußbodenheizung - <?php echo $etage; ?>',
rightGap: 20, //rechter Rand
// Legende
labelsDiv: document.getElementById('legende2'),
labelsSeparateLines: true,
labelsKMB: NaN,
legend: 'always',
labels: <?php echo $label_fbh; ?>,
// Achsen
ylabel: 'Temperatur (C)',
connectSeparatedPoints: NaN,
colors: ['black', 'red', 'blue', 'green', 'orange', 'magenta'],
}
);
<!-- CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC -->
gC = new Dygraph(
document.getElementById("diagramm3"),
<!-- Daten -->
<?php echo $str_digi; ?> ,
<!-- Optionen -->
{
title: 'Heizkreisventile - <?php echo $etage; ?>',
rightGap: 20, //rechter Rand
// Legende
labelsDiv: document.getElementById('legende3'),
labelsSeparateLines: true,
labelsKMB: NaN,
legend: 'always',
labels: <?php echo $label_digi; ?>,
// Achsen
//xlabel: 'Zeit',
ylabel: 'Aus/Ein',
connectSeparatedPoints: NaN,
colors: ['red', 'blue', 'green', 'orange', 'yellow'],
}
);
<!-- hiermit werden die Diagramme zusammengebunden -->
var sync = Dygraph.synchronize([gA, gB, gC], {selection: true, range: false});
</script> <!-- Ende text/javascript -->
<form action="sync_auswahl.html" method="post">
<br>
<input type="submit" value="zurück zur Auswahl">
</form>
</body>
</html>
Ich hoffe, das erschlägt nicht und trägt zur Klärung bei. Gruß Gerd
Der Martin
Auge