Hallo zusammen,
da HighChartsPHP mit MySQL-Daten bisher wohl niemand verwendet, hab auf meine Anfrage in Post #12 zumindet keine Antwort bekommen, hier meine Lösung die ich nach langem suchen gefunden habe. Für diejenigen dies interssiert.
- im Vergleich zur „alten“ Version ist es jetzt notwendig das DatenArray das an HC übergeben wird zu ändern.
alt: array(„Value“=>$data[‚temp_max‘], „TimeStamp“=>$DateY, „TimeStampHuman“=>date(„d.m.Y h:i“,strtotime($data[‚DateX‘])))
dabei war der TimeStampHuman nur zur Kontrolle und wurde in der Auswertung ignoriert. Die Werte in Value kommen 1:1 aus der MySQL.
neu: array(„0“=>$DateY*1000, „1“=>$data[‚temp_max‘]*1);
Es ist zuwingend, dass der Timestamp an erster Stelle steht und „0“ heisst. Der Value steht an 2. Stelle und heisst „1“.
Edit:Weitere Daten wie (TimeStampHuman) müssen auch nummeriert werden: „2“=>… .
-
wie in o.g. Beisspiel muss der Timestamp, wie gehabt noch mit 1000 multipliziert werden.
-
wie in o.g. Beispiel hab ich value noch mit 1 multipliziert. Hintergrund ist, dass obwohl der Wert in der MySQL Float ist, er wenn er in das Array geschrieben wird, als Sting übergeben wird. Herausgefunden durch vergleichen von generierten HC-Scripts mit verschiedenen Erstellmethoden. Durch die Multiplikation wirds wohl wieder ein Zahlenwert.
Damit sollte es dann auch mit MySQL gehen.
Bsp: Alles entfernt was mit Daten aus IPS zusammenhängt. Der Rest ist „neu MySQL“ oder original RS
<?
################## Zeitraum #############################################################
// Zeitraum
$ts = GetValue(45329 /*[Logisch\Wetter\InternetWetter\HC\Monatswerte\ZeitraumA\ZeitraumA\Startzeit]*/ );
$te = GetValue(35703 /*[Logisch\Wetter\InternetWetter\HC\Monatswerte\ZeitraumA\ZeitraumA\Endzeit]*/ );
$ts_yet = date("(D) d.m.Y H:i", $ts);
$te_yet = date("(D) d.m.Y H:i", $te);
$SQLStart = "'".date("Y-m-d H:i:s",$ts)."'";
$SQLEnd = "'".date("Y-m-d H:i:s",$te)."'";
// Print_r($SQLStart." - ".$SQLEnd."
");
If ($ts>time())
{echo "Zeitauswahl liegt mit StartDatum in der Zukunft. Bitte wählen Sie einen Zeitraum in der Vergangenheit.";
exit();}
################## User-Konfig #############################################################
// MySQL DB-Daten:
$MySQLConn=mysql_connect($MySQLIP.$MySQLPort, $MySQLAdmin, $MySQLAdminPW);
$db = $IPS_DB;
$SQLTable1 = $TBL_Wetter_Internet_Monat; // Monatswerte
$db_selected = mysql_select_db($db, $MySQLConn);
//------------------------------------------------------------------------------
// MySQL Daten holen
//Aussentemperaturen
$sql_Ergebnis1 = mysql_query("SELECT DateX, temp_max
FROM " . $SQLTable1 ."
WHERE DateX >= ".$SQLStart." AND DateX <= ".$SQLEnd."
ORDER BY DateX;")
OR die("'".$sql_Ergebnis1."':".mysql_error());
$TempMax = "";
$i = 0;
while($data = mysql_fetch_array($sql_Ergebnis1, MYSQL_ASSOC))
{
$DateY = mktime(12,0,0,date("m",strtotime($data['DateX'])),date("d",strtotime($data['DateX'])),date("Y",strtotime($data['DateX'])));
// $TempMax[] = array("Value"=>$data['temp_max'], "TimeStamp"=>$DateY, "TimeStampHuman"=>date("d.m.Y h:i",strtotime($data['DateX']))); // alt
$TempMax[] = array("0"=>$DateY*1000, "1"=>$data['temp_max']*1); // neu
}
$i++;
//------------------------------------------------------------------------------
//MySQL Verbindung beenden
mysql_close($MySQLConn);
//print_r($TempMax);
################## IPS-Konfig ##############################################################
// HighCharts PHP includen
include "12413.ips.php";
$Filename = $_IPS['SELF'].".hc.php";
$Path = "user/RS_HighCharts/tmp/";
$HC_Content_ID = 30871 /*[Test\HighChartsPHP\RS HighChartsPHP\WetterMonatMinMax\WetterMonatMinMax]*/ ;
################## HC-Konfig ###############################################################
$chart = new Highchart();
// Chart-Titel
$chart->title->text = "Max Temp Monate";
$chart->title->style->color = 'rgba(255,255,255, 1.0)';
$chart->title->style->fontSize = '16px';
$chart->subtitle->text = 'Zeitraum: '.$ts_yet.' - '.$te_yet;
$chart->subtitle->style->color = 'rgba(255,255,255, 0.7)';
################### Chart Series ##################################################################################################
$S_ID = 0; // Series-ID
// $RoundedValue = 1;
$chart->series[$S_ID]->name = "Temperatur";
$chart->series[$S_ID]->data = $TempMax;
// $chart->series[$S_ID]->stack = 'yesterday';
$chart->series[$S_ID]->zIndex = 90;
$chart->series[$S_ID]->type = "line";
// $chart->series[$S_ID]->step = true;
$chart->series[$S_ID]->yAxis = 0;
$chart->series[$S_ID]->visible = true;
$chart->series[$S_ID]->showInLegend = true;
$chart->series[$S_ID]->enableMouseTracking = true;
$chart->series[$S_ID]->color = 'rgba(255,255,255, 0.9)';
$chart->series[$S_ID]->shadow = false;
$chart->series[$S_ID]->dashStyle = NULL;
$chart->series[$S_ID]->lineWidth = 1;
$chart->series[$S_ID]->states->hover->lineWidth = 2;
$chart->series[$S_ID]->states->lineColor = 'rgba(255,255,255,1.0)';
$chart->series[$S_ID]->marker->enabled = true;
$chart->series[$S_ID]->marker->symbol = 'circle';
$chart->series[$S_ID]->marker->lineWidth = 0;
$chart->series[$S_ID]->marker->states->hover->enabled = true;
$chart->series[$S_ID]->marker->states->hover->symbol = 'circle';
$chart->series[$S_ID]->marker->states->hover->radius = 4;
$chart->series[$S_ID]->marker->states->hover->lineWidth = 1;
$chart->series[$S_ID]->marker->states->hover->lineColor = 'rgba(255,255,255,1.0)';
// Achsen-Definitionen ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
// y-Axis
// y-Axis 0
$yAxID = 0;
$chart->yAxis[$yAxID]->title->text = "Temperatur (°C)";
$chart->yAxis[$yAxID]->title->style->color = 'rgba(255,255,255, 0.8)';
$chart->yAxis[$yAxID]->unit = NULL;
$chart->yAxis[$yAxID]->opposite = false;
$chart->yAxis[$yAxID]->allowDecimals = true;
$chart->yAxis[$yAxID]->min = NULL;
$chart->yAxis[$yAxID]->tickInterval = 5;
$chart->yAxis[$yAxID]->max = NULL;
$chart->yAxis[$yAxID]->gridLineWidth = 1;
$chart->yAxis[$yAxID]->gridLineColor = 'rgba(255,255,255, 0.1)';
$chart->yAxis[$yAxID]->labels->style->color = 'rgba(255,255,255, 0.8)';
// x-Axis
$chart->xAxis->type = 'datetime';
$chart->xAxis->labels->style->color = 'rgba(255,255,255, 0.6)';
$chart->xAxis->gridLineWidth = 1;
$chart->xAxis->gridLineColor = 'rgba(255,255,255, 0.1)';
// Legend
$chart->legend->align = 'center';
$chart->legend->backgroundColor = 'rgba(255,255,255, 0.0)';
$chart->legend->itemStyle->color = 'rgba(255,255,255, 0.8)';
$chart->legend->itemStyle->fontWeight = 'normal';
$chart->legend->itemHiddenStyle->color = 'rgba(255,255,255, 0.3)';
$chart->legend->itemHoverStyle->color = 'rgba(255,255,255, 1.0)';
// Chart-Config "Credits" by RS
$chart->credits->enabled = false;
$chart->credits->href = 'http://www.raketenschnecke.net';
$chart->credits->text = 'www.raketenschnecke.net';
$chart->credits->position->align = "right";
$chart->credits->position->x = -10;
$chart->credits->position->verticalAlign = 'top';
$chart->credits->position->y = 15;
// plotOptions
$chart->plotOptions->series->states->hover->brightness = 0.1;
$chart->plotOptions->column->stacking = 'normal';
$chart->plotOptions->column->borderColor = '#EFEFEF';
$chart->plotOptions->column->borderWidth = 1;
$chart->plotOptions->column->shadow = false;
$chart->plotOptions->column->pointPadding = -0.05;
$chart->plotOptions->column->groupPadding = 0.2;
$chart->plotOptions->series->states->hover->brightness = 0.2;
// exporting
$chart->exporting->enabled = false;
$chart->navigation->enabled = false;
// Tooltip
$chart->tooltip->useHTML = true;
$chart->tooltip->backgroundColor = 'rgba(0,0,0, 0.7)';
$chart->tooltip->shared = true;
$chart->tooltip->crosshairs[0] = false;
$chart->tooltip->crosshairs[1] = array('width' =>1,'color' =>'grey','dashStyle'=>'longdash' );
$chart->tooltip->style->color = 'rgba(255,255,255, 0.9)';
$chart->tooltip->style->fontSize = '10px';
$chart->tooltip->style->padding = '8px';
// $chart->tooltip->formatter = new HighchartJsExpr(formatter_String());
// Chart Config II
$chart->chart->renderTo = "container";
$chart->chart->backgroundColor = "rgba(255,255,255, 0.0)";
$chart->chart->plotBorderWidth = 1;
$chart->chart->plotBorderColor = "rgba(255,255,255, 0.5)";
$chart->chart->marginBottom = 70;
$chart->chart->height = 310;
// HC-Options (global, lang)
$option = new HighchartOption();
$option->global->useUTC = false;
$option->lang->decimalPoint = ',';
$option->lang->thousandsSep = ".";
$option->lang->months = array('Januar', 'Februar','Mrz', 'April','Mai', 'Juni','Juli', 'August','September', 'Oktber','November', 'Dezember');
$option->lang->shortMonths = array('Jan', 'Feb','Mrz', 'Apr','Mai', 'Jun','Jul', 'Aug','Sep', 'Okt','Nov', 'Dez');
$option->lang->weekdays = array('Montag', 'Dienstag','Mittwoch', 'Donnerstag','Freitag', 'Samstag','Sonntag');
################################ Ausgabe ##############################################################
// HC-Content in String umformen (für Einbau in HTML-Content)
$HC_Option = Highchart::setOptions($option);
$HC_Chart = $chart->render("chart");
// Pfadangaben für .js-Scripte (jquery, Highcharts). Die .js-Scripte sollten nur dann geladen werden, wenn sie wirklich im Chart benötigt werden (Performance im WFE!)
$js_Scripts[] = '/user/RS_HighCharts/jquery/2.1.0/jquery.js';
$js_Scripts[] = '/user/RS_HighCharts/js/highcharts.js';
$js_Scripts[] = '/user/RS_HighCharts/js/highcharts-more.js';
// $js_Scripts[] = '';
// HTML-Content in Variable schreiben
$Content = HTML_Content($js_Scripts, $HC_Chart, $HC_Option);
setValue($HC_Content_ID , '<iframe src="./'.$Path.$Filename.'" width="100%" height="300" name="HighChart" scrolling="no" marginheight="0" marginwidth="0" frameborder="0">');
write_content($Path, $Filename, $Content);
################################ Functions #############################################################
function formatter_String()
{
global $WeekDay;
$s =
"function() {
var s = '<b>' + Highcharts.dateFormat('%H Uhr', this.x) +'</b>';
s += '<table cellspacing=\"0\" cellpadding=\"0\" width=\"195px\" style=\" font-size:12px; color:rgba(255,255,255, 0.9);\">';
s += '<tr><td style=\"width:15px; height:5px;\"> </td><td style=\"width:100px;\"> </td><td style=\"width:80px;\"> </td></tr>';
$.each(this.points, function(i, point) {
[this.series.name];
if((point.series.name == 'Strom1') || (point.series.name == 'Temperatur'))
{
s += '<tr><td colspan=\"2\">' + '<span style=\"color:' + point.series.color + '\">' + point.series.name +': </span></td><td align=right style=\"color:' + point.series.color + '\">' + point.y.toFixed(1) + ' kWh</td></tr>';
}
else
{
s += '<tr><td colspan=\"2\">' + '<span style=\"color:' + point.series.color + '\">' + point.series.name +': </span></td><td align=right style=\"color:' + point.series.color + '\">' + point.y.toFixed(1) + ' °C</td></tr>';
}
});
s += '</table>';
return s;
}";
return $s;
}
// Function write_content, schreibt das fertige HC als ID.hc.php auf die Platte
function write_content($Path, $Filename, $Content)
{
$Path = IPS_GetKernelDir()."webfront/".$Path;
// Ordner anlegen, wenn nicht vorhanden
if (!is_dir($Path))
mkdir ($Path , 0777, true);
// File schreiben
$handle = fopen($Path.$Filename,"w");
fwrite($handle, utf8_encode($Content));
fclose($handle);
}
// Function HTML_Content, erzeugt aus Eingabedaten einen vollständigen HTML/PHP-String für HC-File
function HTML_Content($js_Scripts, $HC_Content, $HC_Option)
{
// 1. Teil
$s = '<html>
<head>
<title>RS HighChartsPHP</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- 2. Add the JavaScript to initialize the chart on document ready -->';
// js-Scripte
foreach($js_Scripts as $key=>$rs)
{
$s = $s.'
<script type="text/javascript" src="'.$rs.'"></script>';
}
// 2. Teil
$s = $s.'
<script type="text/javascript">
$(document).ready(function() {
'.$HC_Option.'
'.$HC_Content.'
});
</script>
</head>
<body></body>
</html>';
return $s;
}
?>
