HighCharts - Problem bei der Tooltip-Darstellung mit Pic's

Hallo in die Runde,

eigentlich hätte ich das gern als fertige Lösung präsentiert, ich bekomme es aber bei mir nicht zum Laufen. Wäre super, wenn mich hier ein HTML-Experte bei der Fehlereingrenzung helfen kann

Ziel:
Ziel ist es, im Tooltipp -abhängig vom angefahrenen Meßwert - ein Webcam-Picture über den Daten im Tooltipp anzeigen zu lassen. Also pro Minute/Tag/Monat/Jahr das dazu passende Webcam-Bild mit gleichem Timestamp.

Problem:
Auf dem API-Doku-Server von HighCharts bekomme ich das zum laufen, bei mir auf dem Webserver nicht. Es wird eigentlich alles angezeigt, bis auf die entsprechenden Pics im Tooltip. Ich suche schon seit gestern Mittag, kann aber den Fehler nicht finden.
Der
Vielleicht kann mir jemand helfen, das Problem einzugrenzen?

Code für den HC-API-DokuServer (dort ins untere linke Fenster einfügen und dann oben im Menü auf „Run“ clicken. Anschließend werden für die ersten 3 Monate im Chart die WebCam-Pics in den Tooltip eingeblendet):


$(function () {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container'
        },
        
        tooltip: {
            
            
            shared: false,
            useHTML: true,

            formatter: function() {
                return '</b>'+'<img  src="http://www.raketenschnecke.net/webcam/timelapse/mbx01/vga/2012/'+ this.x +'/27/mbx01_1200.jpg" width="128" height="96" alt="Tanzmaus">'+ this.x+'</b>' ;
            },

        },
        
        xAxis: {
            categories: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12']
        },
        
        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
        }, {
            data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4]        
        }]
    });
});

entscheidend für die Pic-Anzeige im Tooltip ist folgende Passage im obigen Code:


useHTML: true,

            formatter: function() {
                return '</b>'+'<img  src="http://www.raketenschnecke.net/webcam/timelapse/mbx01/vga/2012/'+ this.x +'/27/mbx01_1200.jpg" width="128" height="96" alt="Tanzmaus">'+ this.x+'</b>' ;

Diese Code kann ich so nicht direkt ins HC-Cart einfügen (Kollisionen mit ’ " '), daher habe ich die Link-Bestandteile in Variablen ausgelagert und anschließande den Code wie folgt in den formatter eingefügt (gegenüber oben vereinfacht und this.x aus dem Link-Konstrukt rausgenommen):


// Link-Definition:
$ReturnString_a   = '<img src="http://www.raketenschnecke.net/webcam/timelapse/mbx01/vga/2012/03/27/mbx01_1200.jpg">' ;



useHTML: true,
formatter: function() {
	 return '$ReturnString_a';
            },

und offensichtlich führt genau das dazu, dass das Pic nicht im Tooltip angezeigt wird.

Ergänzend dazu der fertige Code-Teil, der ins tmp-File geschrieben wird (der m.E. korrekt ist):


useHTML: true,
formatter: function() {
 return '<img src="http://www.raketenschnecke.net/webcam/timelapse/mbx01/vga/2012/03/27/mbx01_1200.jpg">';
	},

Vielleicht noch ein paar System-Angaben:

IIS 7.5 -> Tooltip-Pics werden nicht angezeigt
IP-Symcon, HTML-Box: -> Tooltip-Pics werden nicht angezeigt


return '$ReturnString_a';

retouniert immer einen String, aber nie die eigentliche Variable.

Poste doch noch mal das komplette Script, mir fehlt da der Kontext (eventuell vermischt Du da PHP und Javascript).

Hi Andreas,

hätte ich auch gedacht, war ne Verzweiflungstat. Hat aber funktioniert: der Inhalt der variable wird übergeben, nicht die Variable selbst.

den Output (.tmp-File) kann man sich hier anschauen, das fertige Chart hier. Das .tmp-File wird vom „Template.php“ (siehe 2. Link) aufgerufen, in dem befinden sich die von den HC-Scripten unten die generierten Codes

es sind 2 Scripte: 1x Config-Script (ist das auslösende Script) und 1x das eigentliche HighChart-Script, für diesen Zweck „umgebaut“:


<?
$CfgDaten = array();
//################# Konfig #####################################################
// Timestamps:
$ts = getValue(33279 /*[Astro-Script\astro\astronomische Morgendämmerung]*/ );
$te = getValue(22382 /*[Astro-Script\astro\astronomische Abenddämmerung]*/ );
$year = 2011;
$Sonnenstand_verlauf_forecast = getValue(33171 /*[Astro-Script\Sonnenstand\Sonnenstand heute vorberechnen\Sonnenstand Verlauf heute]*/ );

// Überschriften
$CfgDaten["Title"]= NULL;
$CfgDaten["SubTitle"]= NULL; // "" = Automatisch über Zeitraum


// IPS Variablen ID´s
$CfgDaten["ArchiveHandlerId"]= 58669 /*[Archive Handler]*/;     // Archive Handler
$CfgDaten["ContentVarableId"]= IPS_GetParent( $IPS_SELF);  // ID der Content-Variable
$CfgDaten["HighChartScriptId"]= 35562 /*[HighCarts\HighCharts Test Formatter mit Pics]*/ ;                  // ID des Highcharts Scripts

// Zeitraum welcher dargestellt werden soll
// 1. Darstellungszeitraum
$CfgDaten["StartTime"] = mktime(substr($ts,0,2), substr($ts,3,2), substr($ts, 6,2), date("m", time()), date("d",time()), date("Y",time())); // ab heute 00:00 Uhr
$CfgDaten["EndTime"] = mktime(substr($te,0,2), substr($te,3,2), substr($te, 6,2), date("m", time()), date("d",time()), date("Y",time())); // ab heute 23:59 Uhr, oder //$CfgDaten["EndTime"] = time();   // = bis jetzt
// 2. Darstellungszeitraum
//$CfgDaten01["StartTime"] = mktime(0,0,0, date("m", time()), date("d",time())-1, date("Y",time())); // ab heute 00:00 Uhr
//$CfgDaten01["EndTime"] = mktime(23,59,0, date("m", time()), date("d",time())-1, date("Y",time())); // ab heute 23:59 Uhr, oder //$CfgDaten["EndTime"] = time();   // = bis jetzt

// Variablen-Parameter
$chart_var1_id = 38123 /*[Astro-Script\Sonnenstand\Sonnenstand\Elevation]*/ ;
$chart_var1_name = "Sonnenstand";
$chart_var1_unit = "°";
$chart_var1_yAxis = 0;
$chart_var1_time =
$chart_var2_id = 25287 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Rohdatenverarbeitung\Eltako FAH60 Helligkeit Balkon\Helligkeit]*/ ;
$chart_var2_name = "FAH60";
$chart_var2_unit = "lx";
$chart_var2_yAxis = 1;
$chart_var3_id = 53540 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Meßdaten\Helligkeit Ost]*/ ;
$chart_var3_name = "Ost";
$chart_var3_unit = "lx";
$chart_var3_yAxis = 1;
$chart_var4_id = 13741 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Meßdaten\Helligkeit Süd]*/ ;
$chart_var4_name = "Sued";
$chart_var4_unit = "lx";
$chart_var4_yAxis = 1;
$chart_var5_id = 25966 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Meßdaten\Helligkeit West]*/ ;
$chart_var5_name = "West";
$chart_var5_unit = "lx";
$chart_var5_yAxis = 1;
$chart_var6_id = 58461 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Meßdaten\Helligkeit Twilight]*/ ;
$chart_var6_name = "Twilight";
$chart_var6_unit = "lx";
$chart_var6_yAxis = 1;
$chart_var7_id = 37806 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Meßdaten\Helligkeit]*/ ;
$chart_var7_name = "gesamt";
$chart_var7_unit = "lx";
$chart_var7_yAxis = 1;
$chart_var8_id = 50299 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Meßdaten\Helligkeit max]*/ ;
$chart_var8_name = "gesamt max";
$chart_var8_unit = "lx";
$chart_var8_yAxis = 1;
$chart_var9_id = 10532 /*[Wetterdaten RS.loc\Thies Clima D\Helligkeit\Meßdaten\Helligkeit min]*/  ;
$chart_var9_name = "gesamt min";
$chart_var9_unit = "lx";
$chart_var9_yAxis = 1;



//################# Konfig Ende ################################################

// => ab V1.0003
$CfgDaten["RunMode"]= "file";     //oder script

// => ab V1.0003
// Serienübergreifende Einstellung für das Laden von Werten
$CfgDaten["AggregatedValues"]["HourValues"] = 3;      // ist der Zeitraum größer als X Tage werden Stundenwerte geladen
$CfgDaten["AggregatedValues"]["DayValues"] = 3;       // ist der Zeitraum größer als X Tage werden Tageswerte geladen
$CfgDaten["AggregatedValues"]["NoLoggedValues"] = 60; // ist der Zeitraum größer als X Tage werden keine Boolean Werte mehr geladen, diese werden zuvor immer als Einzelwerte geladen
$CfgDaten["AggregatedValues"]["MixedMode"] = false;     // alle Zeitraumbedingungen werden kombiniert

// Die Parameter für die einzelnen Chart Serien (Achtung! unbedingt auf Groß-Kleinschreibung achten)
// Name: Name der Kurve (Anzeige in Legende und Tooltip)
// Unit: NULL = Einheit wird aus Suffix des eingestellten Profils übernommen
//       "string" = string wird als Einheit eingetragen
//       array(0=>'String für 0',1=>'String für 1', usw.) = Ist der Wert 0 wird 'Strung für 0' im Tooltip angezeigt, usw
// ReplaceValues: false = Werte werden wie geloggt übernommen
//            array(0=>0.2,1=>10, usw.) = der Wert 0 wird in 0.2 geändert, der Wert 1 wird in 10 geändert
//       das macht für die Darstellung von Boolean Werte Sinn, oder für Drehgriffkontakte (Werte 0,1,2) Sinn
// Param: Einstellungen der Kurve (hier können werden exakt Einstellungen aus Higcharts.com eingegeben) hier ein paar Beispiele
//    type: Art der Kurve: Simm machen [area, areaspline, line, spline], noch nicht sinnvoll dargestellt werden [pie, scatter, bar, column]
//    step: true oder false - jeder Werte bildet eine Stufe (sinnvoll für Heizungsteller, oder Sollwertvorgaben)
//    yAxis: Nummer welche Y-Achse verwendet werden soll (ab 0)
//    shadow: true oder false - Darstellung mit oder ohne Schatten
//    lineWidth: Linienstärke
//    alles weitere bitte aus der Higcharts-Referenz entnehmen -> http://www.highcharts.com/ref/
// und so könnte für eine Achse seperate Einstellungen für die AggregattedValues getroffen werden

//$AggregatedValuesForSeries["HourValues"] = 3;
//$AggregatedValuesForSeries["DayValues"] = 2;
//$AggregatedValuesForSeries["DayValues"] = 2;
//$AggregatedValuesForSeries["Combined"] = true;
//,"AggregatedValues"=>$AggregatedValuesForSeries

$CfgDaten["Series"][] = array("Id"=> $chart_var1_id , "Name" =>$chart_var1_name,    "Unit"=> $chart_var1_unit, "AggType"=>1, "RoundValues"=> 2 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var1_yAxis, visible: true, color: '#E1E1E1', shadow: true, lineWidth: 2 ,
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>$chart_var2_id, "Name" =>$chart_var2_name, "Unit"=>$chart_var2_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var2_yAxis, visible: true, color: '#00AAFF',shadow: true, lineWidth: 1,
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>$chart_var3_id, "Name" =>$chart_var3_name, "Unit"=>$chart_var3_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var3_yAxis, visible: false, color: '#3BE590', shadow: true, lineWidth: 1,
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>$chart_var4_id, "Name" =>$chart_var4_name,"Unit"=> $chart_var4_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var4_yAxis, visible: true, color: '#FFFF00', shadow: true, lineWidth: 1,
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>$chart_var5_id, "Name" =>$chart_var5_name,"Unit"=> $chart_var5_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var5_yAxis, visible: false, color: '#D400FF', shadow: true, lineWidth: 1,
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>$chart_var6_id, "Name" =>$chart_var6_name,"Unit"=> $chart_var6_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var6_yAxis, visible: false, color: '#D88358', shadow: true, lineWidth: 1,
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>$chart_var7_id, "Name" =>$chart_var7_name,"Unit"=> $chart_var7_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var7_yAxis, visible: true, color: '#FFAA00', shadow: true, lineWidth: 2,
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
/*$CfgDaten["Series"][] = array("Id"=>29410, "Name" =>"Tür/Fenster Kontakt","Unit"=>NULL, "ReplaceValues"=>array(0=>0.2,1=>10),
    "Param" =>"type:'area', step: true, yAxis: 1, shadow: true,lineWidth: 1, states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, symbol: 'circle', radius: 4, lineWidth: 1}}}");
$CfgDaten["Series"][] = array("Id"=>44451, "Name" =>"Drehgriffkontakt", "Unit"=>array(0=>'geschlossen',1=>'gekippt',2=>'geöffnet'), "ReplaceValues"=>array(0=>0.2,1=>7,2=>10),
    "Param" =>"type:'area', step:true, yAxis: 1, shadow: true,lineWidth: 1, states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>43639, "Name" =>"Heizungssteller", "Unit"=>"%","ReplaceValues"=>false,
    "Param" =>"type:'line', step:true, yAxis: 1, shadow: true,lineWidth: 1, states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
*/
$CfgDaten["Series"][] = array("Id"=>$chart_var8_id, "Name" =>$chart_var8_name,"Unit"=> $chart_var8_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var8_yAxis, visible: false, color: '#FFAA00', shadow: true, lineWidth: 1,  dashStyle: 'LongDash',
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
$CfgDaten["Series"][] = array("Id"=>$chart_var9_id, "Name" =>$chart_var9_name,"Unit"=> $chart_var9_unit, "AggType"=>1, "RoundValues"=> 0 , "ReplaceValues"=>false,
    "Param" =>"type:'spline', step:true, yAxis: $chart_var9_yAxis, visible: false, color: '#FFAA00', shadow: true, lineWidth: 1,  dashStyle: 'Dot',
        states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
/*
//oder
foreach(IPS_GetInstanceListByModuleID("{EE4A81C6-5C90-4DB7-AD2F-F6BBD521412E}") as $InstanceId)
{
    if(IPS_StatusVariableExists($InstanceId, "TEMPERATURE"))
    {
        $var = IPS_GetStatusVariable($InstanceId, "TEMPERATURE");

        // Float Variable (.... ist schon etwas wage sich auf den VariablenTyp zu verlassen)
    if($var['VariableType'] == 2 )
    {
            //$V = GetVariableArray($InstanceId, "TEMPERATURE");
            $Name = str_replace("Funk Devices\\", "", IPS_GetLocation($var["VariableID"]));
            $Name = str_replace("\\", "/", $Name );

            $CfgDaten["Series"][] = array("Id"=>$var["VariableID"], "Name" =>$Name,    "Unit"=>"°C", "ReplaceValues"=>false,
                "Param" =>"type:'spline', step:false, yAxis: 0, shadow: true,lineWidth: 1 , states: {hover:{lineWidth: 2}}, marker: { enabled: false, states: { hover: { enabled: true, radius: 4}}}");
    }
    }
}
*/
// Y-Achsen
$CfgDaten["yAxis"][] = array("Name" =>"Elevation °", "Unit"=>"", "Min"=>0, "Max"=> 60,"TickInterval"=>10, "Opposite"=>false);
// $CfgDaten["yAxis"][] = array("Name" =>"Temperaturen", "Unit"=>"°C",/*"TickInterval"=>5,*/"Opposite"=>false);
$CfgDaten["yAxis"][] = array("Name" =>"Helligkeit lx", "Unit"=>"", "Min"=>0, /*"Max"=>120000, "TickInterval"=>20000, */ "Opposite"=>true);
//$CfgDaten["yAxis"][] = array("Name" =>"UVI", "Unit"=>"","Min"=>0, /*"Max"=>7,"TickInterval"=>1,*/"Opposite"=>true);
//$CfgDaten["yAxis"][] = array("Name" =>"hPa", "Unit"=>"",/*"Min"=>0, /*"Max"=>7,"TickInterval"=>1,*/"Opposite"=>true);

//oder direkt den String für die Achsen übergeben $CfgDaten["yAxis"][] = "title: { text: 'Heizungssteller / Luftfeuchte' }, min:0";

// X-Achse ist autom. Time-Format

// => ab V1.0002
// HighchartConfig String
$CfgDaten["HighChartCfg"]= false;  // false = default String wird verwendet

// Beispiel für ein von extern übergebener CfgString. Dies entspricht exakt dem Highcrats ConfigString aus der Highcharts.com/ref
// zusätzlich können bzw. teilweise müssen folgenden Platzhalter verwendet werden.
// %title.text% = $CfgDaten["Title"]
// %subtitle.text% = CfgDaten["SubTitle"], oder bei "" der automatisch erzeugte Zeitraum
// %yAxis% = die genierten y-Achsen welche durch $CfgDaten["yAxis"] konfiguriert wurden
// %tooltip% = der generiert Tooltip
// %xAxis.min% und %xAxis.may% = der durch $CfgDaten["StartTime"] und $CfgDaten["EndTime"] festgelegte Zeitraum
// %data% = die aus der Datenbank gelesenen Daten, ohne diesen Platzhalter läuft gar nichts
/*$CfgDaten["HighChartCfg"]="
            chart: {
                renderTo: 'container',
                zoomType: 'x, y'
            },
            credits: {
                enabled: false
            },
            navigation: {
                buttonOptions: {
                enabled: false
                }
            },
            exporting: {
                buttons: {
                    printButton: {
                        enabled: false
                    }
                }
            },
            

            title: {
                text: '%title.text%',
                x: -20
            },
            subtitle: {
                text: 'Zeitraum: %subtitle.text%',
                x: -20
            },
            xAxis: [{
                type: 'datetime',
                 dateTimeLabelFormats: { second: '%H:%M:%S',
                    minute: '%H:%M',
                    hour: '%H:%M',
                    day: '%e. %b',
                    week: '%e. %b',
                    month: '%b \'%y',
                    year: '%Y'

                 },
                min: %xAxis.min%,
                max: %xAxis.max%,
                allowDecimals: false
            }],
            yAxis: [    %yAxis% ],
            series: [
                            {name: 'Sonne Forecast', type:'spline', yAxis: 0, visible: true, color: '#2D2D2D', shadow: false, lineWidth: 1, showInLegend: false, enableMouseTracking: false,
                                states: {hover:{lineWidth: 1}}, marker: { enabled: false, states: { hover: { enabled: false, radius: 4}}},
                                data:[$Sonnenstand_verlauf_forecast]
                            },
                            %data%
                      ],
            

      
            
            });"; */


// Alle     $CfgDaten["HighChart"] Parameter werden an das IP_Template übergeben
// Highcharts-Themes
// $CfgDaten["HighChart"]["Theme"]="gray.js";   // von Highcharts mitgeliefert: dark-green.js, dark-blue.js, gray.js, grid.js
$CfgDaten["HighChart"]["Theme"]="rs_net.js";   // von Highcharts mitgeliefert: dark-green.js, dark-blue.js, gray.js, grid.js

// Abmessungen des erzeugten Charts
$CfgDaten["HighChart"]["Width"] = 0;     // in px,  0 = 100%
$CfgDaten["HighChart"]["Height"] = 300;     // in px

// und jetzt los ......
$s=IPS_GetScript($CfgDaten["HighChartScriptId"]);      // Id des Highcharts-Scripts
include($s['ScriptFile']);

// => ab V1.0003
// hier werden die CfgDaten geprüft und bei Bedarf vervollständigt
$CfgDaten = CheckCfgDaten($CfgDaten);

// => ab V1.0003
if (isset($CfgDaten["RunMode"]) && $CfgDaten["RunMode"] == "script")
{
    // Variante1: Übergabe der ScriptId. Daten werden beim Aufruf der PHP Seite erzeugt und direakt übergeben. Dadurch kann eine autom. Aktualisierung der Anzeige erfolgen
    if ($IPS_SENDER != "WebInterface")
    {
        WriteContentWithScriptId ($CfgDaten, $IPS_SELF);         // und jetzt noch die ContentTextbox
        return;                                               // Ende, weil durch die Zuweisung des Script sowieso nochmals aufgerufen wird
    }

    $sConfig = CreateConfigString($CfgDaten);                 // erzeugen und zurückgeben des Config Strings
}
else
{
    //Variante2: Übergabe des Textfiles. Daten werden in tmp-File gespeichert. Eine automatische Aktualisierung beim Anzigen der Content-Textbox erfolgt nicht
    $sConfig = CreateConfigString($CfgDaten);             // erzeugen und zurückgeben des Config Strings
    $tmpFilename = CreateConfigFile($sConfig, $IPS_SELF);            // und ab damit ins tmp-Files
    if ($IPS_SENDER != "WebInterface")
    {
        WriteContentWithFilename ($CfgDaten, $tmpFilename);        // und jetzt noch die ContentTextbox
    }
}



?>


<?
    //--------------------------------------------------------------------------------------------------------------------------------
    // Für die Darstellung der Graphen wird das HTML5/JS Framework "Highcharts" der Fa. Highslide Software verwendet (www.highcharts.com)
    // Alle Rechte dieses Frameworks liegen bei Highslide Software
    // 'Highcharts' kann unter folgenden Bedinungen kostenlos eingesetzt werden:
    //     Namensnennung — Sie müssen den Namen des Autors/Rechteinhabers in der von ihm festgelegten Weise nennen.
    //     Keine kommerzielle Nutzung — Dieses Werk bzw. dieser Inhalt darf nicht für kommerzielle Zwecke verwendet werden.
    // Download unter wwww.highcharts.com/download und die Dateien einfach in das Webfront
    // Demos siehe http://www.highcharts.com/demo/

    //--------------------------------------------------------------------------------------------------------------------------------
    // Changelog: V1.0001
    // 30.05.2011  KHC   FIX        Keine Darstellung im Firefox (embed -> iframe) und frameborder = 0 für Darstellung per iFrame
    // 30.05.2011  KHC   NEU          Über Unit=NULL im Serien-Parmeter kann definiert werden, dass das VariableProfile von IPS als Tooltip verwendet wird
    // 30.05.2011  KHC   NEU      CfgDaten: Width und Height werden in px eingegeben und nicht mehr als String, bei width = 0 für 100% möglich
    // Changelog: V1.0002
    // 30.05.2001     KHC   FIX      Wenn keine Series definiert sind - Fehler abgefangen (brauche ich noch später....)
    // 31.05.2011  KHC   NEU      Möglichkeit der Übergabe des vollständigen HighchartConfigStrings (bei keiner Übergabe wird der aktuelle als Defaul genommen)
    // 31.05.2011  KHC   NEU      "IPS_Template.php" - Format auf Deutsch (Tage, Monate)
    // 31.05.2011  KHC   NEU      Im Tooltip wird jetzt zusätzlich der Wochentag angezeigt
    // 03.06.2011  KHC   NEU      Möglichkeit dass beim Anzeigen der Textbox der Inhalt automatisch aktualisiert wird (siehe Bsp.) in Config Script
    // 03.06.2011  KHC   NEU         und dadurch 2 Möglichkeiten der Nutzung: 1. über Textfile, 2. über ScriptId.
    // Changelog: V1.0003
    // 04.06.2011  KHC   NEU      RunMode [Script oder File] über Parameter in CfgDaten einstellbar
    // 05.06.2011  KHC   NEU      CheckCfgDaten: Prüfen bestimmter notwendiger Parameter im CfgDaten und Korrektur
    // 06.06.2011  KHC   NEU      Einstellung per Config wann Werte als Stunden bzw. Tageswerte herangezogen werden (AggregatedValues).
    // 08.06.2011  KHC   NEU      AggregatedValues Einstellungen auch pro Serie möglich
    // 08.06.2011  KHC   NEU      AggregatedValues.MixedMode zum Kombinieren der Einstellungen (z.B.: x Tage alle Werte und danach x Tage nur Stunden Werte, usw.)
    // 08.06.2011  KHC   FIX      IPS_Template.php: Umlaut im 'März' wurde nicht richtig angezeigt
    // 08.06.2011  KHC   FIX      Deutsche Tage im Zeitraum
    // 08.06.2011  KHC   NEU      AggregatedValues.NoLoggedValues liest jetzt Werte bis zu diesem Zeitpunkt (zuvor wurden wenn der Zeitraum größer war gar keine Werte gelesen)
    // Changelog: V1.0004
    // 11.06.2011  KHC   FIX      MixedMode. Wenn Zeitraum durch Berechnung kleiner als Startwert war, wurden diese Werte ebenfalls geladen
    // 22.06.2011  KHC   NEU      CfgDaten: Wenn "ContentVarableId" = -1 und der Script unter der Content Variable angeordnet wird wird die ContentID selbständig ermittelt.
    // 06.07.2011  KHC   NEU      Integration Pie-Charts (Übergabe der Werte über IdArray dann wird der akt. Value verwendet, oder übergabe der Werte über Value-Array
    // Changelog: V1.0005
    // 08.07.2011  KHC   NEU      Pie-Charts: Automatisches Auslesen von AggValues, neuer Parameter: AggType und AggNameFormat
    // 24.07.2011  KHC   NEU      Automatisches Auslesen der Archive-Handler ID
    // 15.12.2011  KHC   NEU      Verbesserte Unterstützung von Zählervariablen (aktueller Wert wird bei Zählern nicht eingeblesen)
    //--------------------------------------------------------------------------------------------------------------------------------

    // ------------------------------------------------------------------------
    // WriteContentWithFilename
    //    Mit dieser Funktion wird der Content-String geschrieben.
    //    IN: $CfgDaten = ..
    //    IN: $tmpFilename = Der Dateiname welche die Config Daten enthält
    //    OUT: der erzeugte Config String
    // ------------------------------------------------------------------------
    function WriteContentWithFilename($CfgDaten, $tmpFilename)
    {
        // damit das Ding auch sauber dargestellt wird
        $Height = $CfgDaten["HighChart"]["Height"] + 16;

        if ($tmpFilename != "")
            SetValue($CfgDaten["ContentVarableId"], '<iframe src="./User/Highcharts/IPS_Template.php?CfgFile='. $tmpFilename.'" width="100%" height="'. $Height .'" frameborder="0" scrolling="no"></iframe>');
        else
            SetValue($CfgDaten["ContentVarableId"], 'Falsche Parameter beim Funktionsaufruf "WriteContentTextbox"');
    }
    // ------------------------------------------------------------------------
    // WriteContentWithScriptId
    //    Mit dieser Funktion wird der Content-String geschrieben.
    //    IN: $CfgDaten = ..
    //    IN: $scriptId = Die Script Id welche den ConfigString enthält.
    //    OUT: der erzeugte Config String
    // ------------------------------------------------------------------------
    function WriteContentWithScriptId($CfgDaten, $scriptId)
    {
        // damit das Ding auch sauber dargestellt wird
        $Height = $CfgDaten["HighChart"]["Height"] + 16;

        // => ab V1.0004, wenn ... dann wird versucht die Content Variable selbst zu ermitteln
        if (!isset($CfgDaten["ContentVarableId"]) || $CfgDaten["ContentVarableId"] <= 0)
        {
             $ContentVariableId = IPS_GetParent($scriptId);
             if (IPS_VariableExists($ContentVariableId))
                     $CfgDaten["ContentVarableId"] = $ContentVariableId;
             else
                   echo "Script sollte unter der Content Variable angeordnet oder in CfgDaten definiert werden";  // das sollte nie passieren
        }

        if ($scriptId >= 0)
            SetValue($CfgDaten["ContentVarableId"], '<iframe src="./User/Highcharts/IPS_Template.php?ScriptId='. $scriptId.'" width="100%" height="'. $Height .'" frameborder="0" scrolling="no"></iframe>');
        else
            SetValue($CfgDaten["ContentVarableId"], 'Falsche Parameter beim Funktionsaufruf "WriteContentTextbox"');
    }

    /* => obsolete ab V 1.0002
    function WriteContentTextbox($CfgDaten, $tmpFilename = "", $scriptId = -1)
    {
        // damit das Ding auch sauber dargestellt wird
        $Height = $CfgDaten["HighChart"]["Height"] + 16;
        SetValue($CfgDaten["ContentVarableId"], '<iframe src="./User/Highcharts/IPS_Template.php?CfgFile='. $tmpFilename . '&ScriptId=$scriptId" width="100%" height="'. $Height .'" frameborder="0" scrolling="no"></iframe>');
    }
    */

    // ------------------------------------------------------------------------
    // CreateConfigFile
    //    Erzeugt das tmp-Higcharts Config-File
    //    IN: $stringForCfgFile = String welcher in das File geschrieben wird
    // ------------------------------------------------------------------------
    function CreateConfigFile($stringForCfgFile, $id)
    {
        // Standarddateiname .....
        $tmpFilename = IPS_GetKernelDir() . "webfront\user\Highcharts\HighChartsCfg$id.tmp";      // für jede ScriptID wird eine eigene Tmp-Datei erzeugt

        // schreiben der Config Daten
        $handle = fopen($tmpFilename,"w");
        fwrite($handle, $stringForCfgFile);
        fclose($handle);

        return $tmpFilename;
    }

    // ------------------------------------------------------------------------
    // CheckCfgDaten
    //    Prüft bestimmte Parameter der $CfgDaten
    //    IN: $CfgDaten = ..
    //    OUT: korrigierte CfgDaten
    // ------------------------------------------------------------------------
    function CheckCfgDaten($CfgDaten)
    {

        // HighChart
        if (!isset($CfgDaten["HighChart"]))
            $CfgDaten["HighChart"]["Theme"]="";

        if (!isset($CfgDaten["HighChart"]["Theme"]))
            $CfgDaten["HighChart"]["Theme"] = "";
        if (!isset($CfgDaten["HighChart"]["Width"]))
            $CfgDaten["HighChart"]["Width"] = 0;
        if (!isset($CfgDaten["HighChart"]["Height"]))
            $CfgDaten["HighChart"]["Height"] = 400;

        // AggregatedValues
        if (!isset($CfgDaten["AggregatedValues"]))
            $CfgDaten["AggregatedValues"]["MixedMode"] = false;

        if (!isset($CfgDaten["AggregatedValues"]["MixedMode"]))
            $CfgDaten["AggregatedValues"]["MixedMode"] = false;
        if (!isset($CfgDaten["AggregatedValues"]["HourValues"]))
            $CfgDaten["AggregatedValues"]["HourValues"] = 7;
        if (!isset($CfgDaten["AggregatedValues"]["DayValues"]))
            $CfgDaten["AggregatedValues"]["DayValues"] = 30;
        if (!isset($CfgDaten["AggregatedValues"]["NoLoggedValues"]))
            $CfgDaten["AggregatedValues"]["NoLoggedValues"] = 90;

        // Series
        if (!isset($CfgDaten["Series"]))
            $CfgDaten["Series"] = array();

        // Series.AggregatedValues
        $Count = count($CfgDaten["Series"]);
        for ($i = 0; $i < $Count; $i++)
        {
            $Serie = $CfgDaten["Series"][$i];

            // => ab V1.0005 (prüfen ob es eine Zählervariable ist
            $VarIsZaehler = @AC_GetAggregationType($Id_AH, $VariableId);   //1=Zähler, 0 = Standard
           if ($VarIsZaehler==1)
           {
               if (!isset($Serie["AggType"]))   // wenn keine Vorhanden auf 0 (Stundenwerte setzen)
                   $CfgDaten["Series"][$i]["AggType"] = 0;

           }
            // prüfen ob für die Serie Einstellungen für AggregatedValues vorhanden ist
            if (isset($Serie["AggregatedValues"]))
            {
                if (!isset($Serie["AggregatedValues"]["MixedMode"]))
                    $CfgDaten["Series"][$i]["AggregatedValues"]["MixedMode"] = $CfgDaten["AggregatedValues"]["MixedMode"];
                if (!isset($Serie["AggregatedValues"]["HourValues"]))
                    $CfgDaten["Series"][$i]["AggregatedValues"]["HourValues"] = $CfgDaten["AggregatedValues"]["HourValues"];
                if (!isset($Serie["AggregatedValues"]["DayValues"]))
                    $CfgDaten["Series"][$i]["AggregatedValues"]["DayValues"] = $CfgDaten["AggregatedValues"]["DayValues"];
                if (!isset($Serie["AggregatedValues"]["NoLoggedValues"]))
                    $CfgDaten["Series"][$i]["AggregatedValues"]["NoLoggedValues"] = $CfgDaten["AggregatedValues"]["NoLoggedValues"];

            }
            else    // nein -> Daten übernehmen
                $CfgDaten["Series"][$i]["AggregatedValues"] = $CfgDaten["AggregatedValues"];

            // diverse Prüfungen bei PIE-Charts
            if (strrpos($Serie["Param"],'pie') > 0)
            {
                // falls nicht als Array definiert -> erzeuge Array
            if (!isset($Serie["Id"]))
                    $CfgDaten["Series"][$i]["Id"]=array();
                else if (!is_array($Serie["Id"]))
               $CfgDaten["Series"][$i]["Id"] = array($Serie["Id"]);
                if (!isset($Serie["Name"]))
                    $CfgDaten["Series"][$i]["Name"]=array();
            else if (!is_array($Serie["Name"]))
               $CfgDaten["Series"][$i]["Name"] = array($Serie["Name"]);
            if (!isset($Serie["Unit"]))
                    $CfgDaten["Series"][$i]["Unit"]=array();
            else if (!is_array($Serie["Unit"]))
               $CfgDaten["Series"][$i]["Unit"] = array($Serie["Unit"]);
                if (!isset($Serie["Value"]))
                    $CfgDaten["Series"][$i]["Value"]=array();
            else if (!is_array($Serie["Value"]))
               $CfgDaten["Series"][$i]["Value"] = array($Serie["Value"]);


                // ab V1.0005 (AggValues)
                if (isset($Serie["AggType"]) && count($CfgDaten["Series"][$i]["Id"]) == 1 && count($CfgDaten["Series"][$i]["Name"]) == 0 && count($CfgDaten["Series"][$i]["Value"]) == 0)
                {
                    $VariableId = $CfgDaten["Series"][$i]["Id"][0];
                    $AggType = $CfgDaten["Series"][$i]["AggType"];
                    $Id_AH = $CfgDaten["ArchiveHandlerId"]; //-> AC_GetAggregatedValues [0=Hour, 1=Day, 2=Week, 3=Month, 4=Year]
                    $LoggedData = @AC_GetAggregatedValues($Id_AH, $VariableId, $AggType, $CfgDaten["StartTime"], $CfgDaten["EndTime"], 0);
                    krsort($LoggedData);
                    if (isset($CfgDaten["Series"][$i]["AggNameFormat"]))
                        $AggNameFormat = $CfgDaten["Series"][$i]["AggNameFormat"];
                    else
                    {
                        //[0=Hour, 1=Day, 2=Week, 3=Month, 4=Year]
                        if ($AggType == 0)   //0=Hour
                            $AggNameFormat="d.m.Y H:i";
                        else if ($AggType ==1) //1=Day
                            $AggNameFormat="d.m.Y";
                        else if ($AggType ==2) //2=Week
                            $AggNameFormat="\K\WW Y";
                        else if ($AggType ==3) //3=Month
                            $AggNameFormat="M Y";
                        else if ($AggType ==4) //4=Year
                            $AggNameFormat="Y";
                    }

                    foreach ($LoggedData as $AggValue)
                   {
                        $CfgDaten["Series"][$i]["Value"][] =$AggValue["Avg"];
                        $CfgDaten["Series"][$i]["Name"][] = ReplaceToGermanDate(date($AggNameFormat,$AggValue["TimeStamp"]));
                   }
                }
                else if (count($CfgDaten["Series"][$i]["Value"]) == 0)
                {
                   foreach ($CfgDaten["Series"][$i]["Id"] as $Id)
                   {
                       $CfgDaten["Series"][$i]["Value"][] = GetValue($Id);
                   }
                }

                // => ab V1.0005 (wieder entfernt)
                /*

                 //$CountOfId = count($CfgDaten["Series"][$i]["Id"]);
                  $CountOfName = count($CfgDaten["Series"][$i]["Name"]);
                 $CountOfUnit = count($CfgDaten["Series"][$i]["Unit"]);
                $CountOfValue = count($CfgDaten["Series"][$i]["Value"]);

                if ($CountOfId != $CountOfName)
                    die("CountOfId != CountOfName");
                if ($CountOfName != $CountOfUnit)
                    die("CountOfName != CountOfUnit");
                if ($CountOfUnit != $CountOfValue)
                    die("CountOfUnit != CountOfValue");
                */
            }

        }


        return $CfgDaten;
    }
    // ------------------------------------------------------------------------
    // CreateConfigString
    //    Erzeugt den für Higcharts benötigten Config String und gibt diesen als String zurück
    //    IN: $CfgDaten = ..
    //    OUT: der erzeugte Config String
    // ------------------------------------------------------------------------
    function CreateConfigString($CfgDaten)
    {
        // Subtitle aus Zeitraum
        if ($CfgDaten["SubTitle"]=="")
            $CfgDaten["SubTitle"]    =  date("(D) d.m.Y H:i",$CfgDaten["StartTime"]) ." - ". date("(D) d.m.Y H:i",$CfgDaten["EndTime"]);

        $CfgDaten["SubTitle"] = ReplaceToGermanDate($CfgDaten["SubTitle"]);

        // Breite und Höhe anpassen
        if ($CfgDaten["HighChart"]["Width"] == 0)
            $CfgDaten["HighChart"]["Width"] ="100%";
        else
            $CfgDaten["HighChart"]["Width"] .="px";

        $CfgDaten["HighChart"]["Height"] .="px";


        // Tooltip Formater
        $TooltipString = CreateTooltipString($CfgDaten);

        // Y-Achsen
        $yAxisString = CreateYAxis($CfgDaten);

        // Alle Daten aus DB lesen
        $Data ="";
        foreach ($CfgDaten["Series"] as $Serie )
        {
            if (strrpos($Serie["Param"],'pie') > 0)    //JS-Parameter für Serie
                $Data .= ReadPieDataAndCreateDataString($CfgDaten, $Serie);
            else
                $Data .= ReadDataFromDBAndCreateDataString($CfgDaten, $Serie);
        }
        $Data = trim($Data,',');

        // kein Cfg String konfiguriert -> nimm den Eigenen
        If (isset($CfgDaten["HighChartCfg"]) && $CfgDaten["HighChartCfg"] != false)
            $StringForCfgFile = $CfgDaten["HighChartCfg"];
        else
            $StringForCfgFile = GetDefaultStringForCfgFile();

        // ersetzen der Platzhalter
        $StringForCfgFile = str_replace("%title.text%", $CfgDaten["Title"], $StringForCfgFile);
        $StringForCfgFile = str_replace("%subtitle.text%", $CfgDaten["SubTitle"], $StringForCfgFile);
        $StringForCfgFile = str_replace("%data%", $Data, $StringForCfgFile);
        $StringForCfgFile = str_replace("%tooltip%", $TooltipString, $StringForCfgFile);
        $StringForCfgFile = str_replace("%yAxis%", $yAxisString, $StringForCfgFile);
        $StringForCfgFile = str_replace("%xAxis.min%", CreateDateUTC($CfgDaten["StartTime"] - 5*60) , $StringForCfgFile);
        $StringForCfgFile = str_replace("%xAxis.max%", CreateDateUTC($CfgDaten["EndTime"] + 5*60), $StringForCfgFile);

        // zusätzliche Daten für File (hat jetzt aber nichts mit den eigentlichen Highchart Config String zu tun
        // z.B.: Breite und Höhe für Container
        $AdditionalConfigData = trim(print_r($CfgDaten["HighChart"], true), "Array
()") ;

        // Zusätzliche Config in Highchart Config hinzufügren
        $StringForCfgFile = $AdditionalConfigData . "
|||
" .  $StringForCfgFile;

        return $StringForCfgFile;
    }

    // => ab V1.0004
    // ------------------------------------------------------------------------
    // ReadPieDataAndCreateDataString
    //    Liest die aktuellen Werte aus den übergebenen Variablen und erzeugt die Daten für das PIE
    //    IN: $CfgDaten, $Serie
    //    OUT: der Data String
    // ------------------------------------------------------------------------
    function ReadPieDataAndCreateDataString($CfgDaten, $Serie)
    {
        $Data ="";
        $Param = $Serie["Param"];

        $CountOfSerie = count($Serie["Value"]);
        for ($i=0; $i<$CountOfSerie; $i++)
        {
            $CurrentValue = $Serie["Value"][$i];
            $Name = $Serie["Name"][$i];
            $Data .= "['".$Name."',$CurrentValue],";
        }
        $Data = trim ($Data , ',');

        $ResultString = "{name: 'pie', $Param, data: [$Data]},";

        return $ResultString;
    }

    // ------------------------------------------------------------------------
    // ReadDataFromDBAndCreateDataString
    //    Liest die Series-Daten aus der DB und schreibt sie in den DataString
    //    IN: $CfgDaten, $Serie
    //    OUT: der Data String
    // ------------------------------------------------------------------------
    function ReadDataFromDBAndCreateDataString($CfgDaten, $Serie)
    {
        // errechne die Zeitspanne
        $Diff = $CfgDaten["EndTime"] - $CfgDaten["StartTime"];
        if ($CfgDaten["EndTime"] > time())
            $Diff = time() - $CfgDaten["StartTime"];

        // Umrechnen der Tage in Sekunden ... für direktes addieren zum Timestamp
        $HourValues = $Serie["AggregatedValues"]["HourValues"] * 24*60*60;    // ab x Tagen werden Stundenwerte ausgelesen
        $DayValues = $Serie["AggregatedValues"]["DayValues"] * 24*60*60;        // ab x Tagen werden Tageswerte ausgelesen
        $DoNotReadLoggedValues = $Serie["AggregatedValues"]["NoLoggedValues"] * 24*60*60;        // ab x Tagen werden keine geloggten Werte mehr ausgelesen

        $MixedMode = $Serie["AggregatedValues"]["MixedMode"];
        $Id_AH = $CfgDaten["ArchiveHandlerId"];
        $LoggedData = false;
        $Data ="";
        $VariableId = (int)$Serie["Id"];
        $ValueKey ="Value";
        $Agg = -1;
      // => ab V1.0005
        $VarIsZaehler = @AC_GetAggregationType($Id_AH, $VariableId);   //1=Zähler, 0 = Standard

        // wenn ReplaceValues definiert wurden werden nur geloggte und keine Aggregated Werte gelesen
        if ($Serie["ReplaceValues"] != false)
        {
            $t1 = $CfgDaten["EndTime"];
            $t2 = $CfgDaten["StartTime"];
            if ($Diff > $DoNotReadLoggedValues)
            {
                $t2 = $CfgDaten["EndTime"] - $DoNotReadLoggedValues;
            }
            // Alle Werte
           $LoggedData = @AC_GetLoggedValues($Id_AH, $VariableId, $t2, $t1, 0);
            $ValueKey ="Value";
        }
      // => ab V1.0005
        else if ($VarIsZaehler == 1) // wenn Zähler dann Werte entsprechend AggType-Einstellung
        {
            $t1 = $CfgDaten["EndTime"];
            $t2 = $CfgDaten["StartTime"];
            $TempData = @AC_GetAggregatedValues($Id_AH, $VariableId, $Serie["AggType"], $t2, $t1, 0);

           foreach ($TempData as $AggValue)
           {
                $AggValue["Value"]    = $AggValue["Avg"];
                $LoggedData[] = $AggValue;
           }
           unset ($TempData);

        }
        else if ($MixedMode)    // im MixedMode werden anfangs alle Werte, dann die Stunden- und zuletzt Tageswerte ausgelesen
        {
           $t1 = $CfgDaten["EndTime"];
           $t2 = $CfgDaten["EndTime"] - $Serie["AggregatedValues"]["HourValues"] * 24*60*60;
           $t3 = $CfgDaten["EndTime"] - $Serie["AggregatedValues"]["DayValues"] * 24*60*60;
           $t4 = $CfgDaten["StartTime"];

            if ($t3<$CfgDaten["StartTime"])
           {
               $t3 = $CfgDaten["StartTime"];
               $t4 = false;
            }
           if ($t2<$CfgDaten["StartTime"])
           {
               $t2 = $CfgDaten["StartTime"];
               $t3 = false;
               $t4 = false;
            }


            // zuerst alle Werte
           $LoggedData = @AC_GetLoggedValues($Id_AH, $VariableId, $t2, $t1, 0);

            // danach die Stundenwerte
            if ($t2 != false && $t3 != false)
            {
                $TempData = @AC_GetAggregatedValues($Id_AH, $VariableId, 0, $t3, $t2, 0);
               foreach ($TempData as $AggValue)
               {
                    $AggValue["Value"]    = $AggValue["Avg"];
                    $LoggedData[] = $AggValue;
               }
               unset ($TempData);
            }

            // und zuletzt Tageswerte
            if ($t3 != false && $t4 != false)
            {
               $TempData = @AC_GetAggregatedValues($Id_AH, $VariableId, 1, $t4, $t3, 0);
               foreach ($TempData as $AggValue)
               {
                    $AggValue["Value"]    = $AggValue["Avg"];
                    $LoggedData[] = $AggValue;
               }
               unset ($TempData);
            }
        }
        else
        {
            $Agg = -1;    // ->  AC_GetLoggedValues
            if ($Diff > $DayValues)
                $Agg = 1;    //  -> AC_GetAggregatedValues [0=Hour, 1=Day, 2=Week, 3=Month, 4=Year]
            else if ($Diff > $HourValues)
                $Agg = 0;    //  -> AC_GetAggregatedValues [0=Hour, 1=Day, 2=Week, 3=Month, 4=Year]

            if ($Agg == -1)
            {
                $t1 = $CfgDaten["EndTime"];
                $t2 = $CfgDaten["StartTime"];

                // Zeitraum ist zu groß -> nur bis max. Zeitraum einlesen
                if ($Diff > $DoNotReadLoggedValues)
                    $t2 = $CfgDaten["EndTime"] - $DoNotReadLoggedValues;

                // Alle Werte
               $LoggedData = @AC_GetLoggedValues($Id_AH, $VariableId, $t2, $t1, 0);
                $ValueKey ="Value";
            }
            else
            {
                $LoggedData = @AC_GetAggregatedValues($Id_AH, $VariableId, $Agg, $CfgDaten["StartTime"], $CfgDaten["EndTime"], 0);
                $ValueKey ="Avg";
            }
        }

        // keine Daten ausgelesen -> Return
        if (!is_array($LoggedData))
            return "";

        //sortieren, so , dass der aktuellste Wert zuletzt kommt
        krsort($LoggedData);

        // aktuellen Wert der Variable noch in Array aufnehmen
      if ($Agg == -1)
      {
            // => ab V1.0005 (.... nicht bei Zählervariablen)
          if ($VarIsZaehler != 1)
            {
                $FullItem[$ValueKey]= GetValue($VariableId);
                $FullItem["TimeStamp"] = time();
                $FullItem["LastTime"] = $FullItem["TimeStamp"];
                $FullItem["Duration"] = 0;
                $LoggedData[] = $FullItem;
            }
        }
        // Logged Daten in Higchart-Format umwandeln
        if ($LoggedData != false)
            $Data .= CreateSeriesData($LoggedData, $CfgDaten, $Serie) ;

        // und Variable freigeben
        unset($LoggedData);

        $Data = trim ($Data , ',');
        $ResultString = "{name: '".$Serie["Name"]."', ".$Serie["Param"].", data: [$Data]},
";
        return $ResultString;
    }

    // ------------------------------------------------------------------------
    // CreateSeriesData
    //    Auslesen von immer wieder benötigten Werten aus der Variable
    //    IN: $arr = Aus IPS-Datenbank ausgelesenen Daten
    //        $seriesName = Name der ChartSerie
    //        $CfgDaten = Alle Config Daten
    //        $CfgDatenSerie = Config Daten der aktuellen Serie
    //    OUT: Highcharts ConfigString für Series-Data
    // ------------------------------------------------------------------------
    function CreateSeriesData($arr, $CfgDaten, $CfgDatenSerie)
    {
        $Serie = $CfgDatenSerie;

        $valStr = false;
        $Data ="";

        // Daten in Log -> auslesen
        if (count($arr) > 0)
        {
            // den korrekten Variablennamen herausfunden, in welchen die Werte gespeichert wurden
            if (isset($arr[0]['Value']))
                $valStr = "Value";   // für AC_GetLoggedValues
            else if (isset($arr[0]['Avg']))
                $valStr = "Avg";     // für AC_GetAggregatedValues

            // kein entsprechender Variablenname gefunden -> Ende
            if (!$valStr)
                return;

            // eigentliches Auslesen der Daten
            foreach ($arr as $value)
            {
                $dt = false;
                //echo(date("r",$value["LastTime"]) ." - " . date("r",$value["TimeStamp"]) ." - $valStr = " . $value[$valStr]."
<br>");
                if ($value["TimeStamp"] < $CfgDaten["StartTime"])
                {
                    $dt = $CfgDaten["StartTime"] ;
                }
                //if ($value["LastTime"] > $CfgDaten["EndTime"])
                //{
                //    $dt = $CfgDaten["EndTime"] ;  // 03.06.2011 Bug Ich denke das das zu Fehlanzeigen führt, da wir den aktuellen Wert auch darstellen
                //}
                if ($dt == false)
                {
                    $dt = $value["TimeStamp"] ;
                }

                // Variablenwert auslesen
                $val = $value[$valStr];
                //$val = round($val, 2); // rundet auf n Nachkommastelle(n)



                // Werte ersetzten (sinnvoll für Boolean, oder Integer - z.B.: TürFenster Kontakt oder Dhregriffkontakt)
                if ($Serie["ReplaceValues"] != false)
                {
                    if (isset($Serie["ReplaceValues"][$val]))
                        $val = $Serie["ReplaceValues"][$val];
                }

            // Roundvalues axelp, Quelle: http://www.ip-symcon.de/forum/156096-post424.html
                if (isset($Serie["RoundValues"]))
                    $val = round($val, $Serie["RoundValues"]);
                // Ende Roundvalues

                // z.B.: Date.UTC(2011,4,27,19,42,19),23.4
                $dtUTC = CreateDateUTC($dt);
                $Data .=  "[$dtUTC,$val],";
            }
        }

        return $Data;
    }

    // ------------------------------------------------------------------------
    // CreateTooltipString
    //    Auslesen von immer wieder benötigten Werten aus der Variable
    //    IN: $CfgDaten = Alle Config Daten
    //    OUT: Highcharts ConfigString für Tooltip-Formatter (Interaktive Anzeige des Wertes)
    // ------------------------------------------------------------------------
    function CreateTooltipString($CfgDaten)
    {
        $s="";
        foreach ($CfgDaten["Series"] as $Serie )
        {
            if (strrpos($Serie["Param"],'pie') > 0)
            {
                $CountOfSerie = count($Serie["Value"]);
                for ($i=0; $i<$CountOfSerie; $i++)
                {
                    $Name = $Serie["Name"][$i];
                    // => ab V1.0005 (somit muss nur mehr einmal die Einheit übergeben werden, falls alle identisch sind)
                    if ($i < count($Serie["Unit"]))
                        $Unit = $Serie["Unit"][$i];

                    $s .= "'".$Name."': this.y + ' ". $Unit."',
";
                }
            }
            else
            {
               // hier wird das VariableCustomProfile aus IPS übernommen
               if (is_null($Serie["Unit"]))
                {
                    // hole das Variablen Profil
                    $IPSProfil = GetIPSVariableProfile($Serie["Id"]);
                    if ($IPSProfil != false)
                    {
                        if (array_key_exists("Associations",$IPSProfil) && count($IPSProfil["Associations"])>0)
                        {
                            $Arr = array();
                            foreach($IPSProfil["Associations"] as $Item)
                            {
                               $Arr[$Item["Value"]] = $Item["Name"];
                            }

                            if (!is_array($Serie["ReplaceValues"]))         // erzeuge Tooltips vollständig aus VariablenProfil
                                $s .= "'".$Serie["Name"]."': ". CreateTooltipSubValues($Arr, array_keys($Arr));
                            else                                                          // oder nehme ReplaceValues zur Hilfe
                                $s .= "'".$Serie["Name"]."': ". CreateTooltipSubValues($Arr, $Serie["ReplaceValues"]);
                        }
                        else
                        {
                            // Suffix als Einheit übernehmen
                            $Serie["Unit"] = trim($IPSProfil["Suffix"], " ");
                            $s .= "'".$Serie["Name"]."': this.y + ' ". $Serie["Unit"]."',
";
                        }
                    }
                }
                // es wurden Unit und ReplaceValues übergeben
                else if (is_array($Serie["Unit"]) && is_array($Serie["ReplaceValues"]))
                {
                    $s .= "'".$Serie["Name"]."': ". CreateTooltipSubValues($Serie["Unit"],$Serie["ReplaceValues"]);
                }
                else        // Einheit aus übergebenem Parmeter Unit
                {
                  $s .= "'".$Serie["Name"]."': this.y + ' ". $Serie["Unit"]."',
";
              }
          }
        }

        $s = trim($s , "," );
        // Tooltips
        $Pointformat      = '<tr><td style="color: {series.color}">{series.name}: </td><td style="text-align: right"><b>{point.y} EUR</b> </td></tr>';
        $ReturnString_a   = '<img src="http://www.raketenschnecke.net/webcam/timelapse/mbx01/vga/2012/03/27/mbx01_1200.jpg">' ;
        $ReturnString_b    = '/27/mbx01_1200.jpg">';
        $PointFormat      = '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b><br/>';
        
        $TooltipString    =
                                "
                                shared: false,
                        useHTML: true,
                            formatter: function() {
                               
                                
                                    
                                return '$ReturnString_a';

                                },
                                
                                ";

        return $TooltipString;
    }

    // ------------------------------------------------------------------------
    // CreateTooltipSubValues
    //    Erzeugt den Tooltip für Unter-Elemente
    //    IN: shownTooltipArr = Array der Werte (Synonyme) welche im Tooltip angezeigt werden sollen
    //        chartValueArr = Array der Werte welche im Chart eingetragen werden
    //    OUT: Tooltip String
    // ------------------------------------------------------------------------
    function CreateTooltipSubValues($shownTooltipArr, $chartValueArr)
    {
        $s="{";
        $Count = count($shownTooltipArr);
        for ($i = 0; $i < $Count ; $i++)
        {
            if (isset($chartValueArr[$i]) && isset($shownTooltipArr[$i]))
               $s .= $chartValueArr[$i] .": '" . $shownTooltipArr[$i] ."'," ;
        }
        $s = trim($s, ",") . "}";

        return $s ."[this.y],
";
    }

    // ------------------------------------------------------------------------
    // GetIPSVariableProfile
    //    Liest das Variablen Profil der übergeben Variable aus
    //    Versucht zuerst das eigene und wenn nicht verfügbar das Standar Profil auszulesen
    //    IN: variableId = Id der Variablen
    //    OUT: Variablen Profil
    // ------------------------------------------------------------------------
    function GetIPSVariableProfile($variableId)
    {
        $Var = IPS_GetVariable($variableId);

        $ProfilName = $Var['VariableCustomProfile'];                 // "Eigenes Profil"

        if ($ProfilName == false)                                      // "Standard" Profil
            $ProfilName = $Var['VariableProfile'];

        if ($ProfilName != false)
        {
            $IPSProfil = IPS_GetVariableProfile($ProfilName);     // und jetzt die dazugehörigen Daten laden
            return $IPSProfil;
        }
        else
            return false;
    }


    // ------------------------------------------------------------------------
    // CreateYAxis
    //    Erzeugen der Y-Achsen Strings für Highchart-Config
    //    IN: $CfgDaten
    //       es besteht die Möglichkeit den Achsen String bereits im Highchart Format zu hinterlegen
    //       oder die folgenden Parameter als Array einzustellen: Name, Min, Max, TickInterval, Opposite, Unit
    //    OUT: Highcharts String für die Achsen
    // ------------------------------------------------------------------------
    function CreateYAxis($CfgDaten)
    {
        if (!array_key_exists("yAxis", $CfgDaten))   // wenn keine Achse definiert wurde dann wenigstens eine automatisch erzeugte zurückgeben
           return "{ title: {text: 'Autom. created yAxes'} }";

        $sResult="";
        foreach ($CfgDaten["yAxis"] as $Axis )
        {
            $s ="";
            if (is_array($Axis))
            {
                if (array_key_exists ('Name', $Axis))
                    $s .=" title: { text: '".$Axis["Name"]."' },";
                if (array_key_exists ('Min', $Axis))
                    $s .=" min:".$Axis["Min"].", ";
                if (array_key_exists ('Max', $Axis))
                    $s .=" max: ".$Axis["Max"].",";
                if (array_key_exists ('TickInterval', $Axis))
                    $s .=" tickInterval: ".$Axis["TickInterval"].",";
                if (array_key_exists ('Opposite', $Axis))
                {
                    if ($Axis["Opposite"])
                        $s .=" opposite: true ,";
                    else
                        $s .=" opposite: false ,";
                }
                if (array_key_exists ('Unit', $Axis))
                    $s .=" labels: {    formatter: function() { return this.value +' " . $Axis["Unit"]."'; }},";

                $s = trim($s , "," );
                $s = "{" . $s ."},";
            }
            else
            {
                $s = "{" . $Axis ."},";
            }
            $sResult .= $s;
        }
        $sResult = trim($sResult , "," );

        return         $sResult;

    }

    // ------------------------------------------------------------------------
    // CreateDateUTC
    //    Erzeugen des DateTime Strings für Highchart-Config
    //    IN: $timeStamp = Zeitstempel
    //    OUT: Highcharts DateTime-Format als UTC String ... Date.UTC(1970, 9, 27, )
    //       Achtung! Javascript Monat beginnt bei 0 = Januar
    // ------------------------------------------------------------------------
    function CreateDateUTC($timeStamp)
    {
        $MonthForJS =  ((int)date("m", $timeStamp))-1 ;    // Monat -1 !!!!!
        return "Date.UTC(" . date("Y,", $timeStamp) .$MonthForJS. date(",j,H,i,s", $timeStamp) .")";
    }

    // ------------------------------------------------------------------------
    // GetDefaultStringForCfgFile
    //    Falls nicht konfiguriert, wird dies als Default String genommen
    //    OUT: natürlich den String ....
    // ------------------------------------------------------------------------
    function GetDefaultStringForCfgFile()
    {
        return
            "credits: {
                enabled: false
            },
            navigation: {
               buttonOptions: {
                    enabled: false
                            }
           },
            exporting: {
                buttons: {
                    printButton: {
                        enabled: false
                    }
                }
            },
            chart: {
                renderTo: 'container',
                zoomType: 'x, y'
            },
            title: {
                text: '%title.text%',
                x: -20
            },
            subtitle: {
                text: 'Zeitraum: %subtitle.text%',
                x: -20
            },
            xAxis: [{
                type: 'datetime',
                 dateTimeLabelFormats: { second: '%H:%M:%S',
                    minute: '%H:%M',
                    hour: '%H:%M',
                    day: '%e. %b',
                    week: '%e. %b',
                    month: '%b \'%y',
                    year: '%Y'

                 },
                min: %xAxis.min%,
                max: %xAxis.max%,
                allowDecimals: false
            }],
            yAxis: [    %yAxis% ],
            tooltip: { %tooltip% },
            series: [ %data% ]
        });";
    }

    // ------------------------------------------------------------------------
    // ReplaceToGermanDate
    //    Falls nicht konfiguriert, wird dies als Default String genommen
    //    IN: String mit englischen Wochentagen, bzw. Monaten
    //    OUT: der String übersetzt ins Deutsche
    // ------------------------------------------------------------------------
    function ReplaceToGermanDate($value)
    {
            $trans = array(
            'Monday'    => 'Montag',
            'Tuesday'   => 'Dienstag',
            'Wednesday' => 'Mittwoch',
            'Thursday'  => 'Donnerstag',
            'Friday'    => 'Freitag',
            'Saturday'  => 'Samstag',
            'Sunday'    => 'Sonntag',
            'Mon'       => 'Mo',
            'Tue'       => 'Di',
            'Wed'       => 'Mi',
            'Thu'       => 'Do',
            'Fri'       => 'Fr',
            'Sat'       => 'Sa',
            'Sun'       => 'So',
            'January'   => 'Januar',
            'February'  => 'Februar',
            'March'     => 'März',
            'May'       => 'Mai',
            'June'      => 'Juni',
            'July'      => 'Juli',
            'October'   => 'Oktober',
            'December'  => 'Dezember',
            'Mar'          => 'Mär',
            'May'       => 'Mai',
            'Oct'        => 'Okt',
            'Dec'           => 'Dez',
        );
        return  strtr($value, $trans);
    }

    function getmicrotime()
    {
       list($usec,$sec)=explode(" ", microtime());
       return ((float)$usec + (float)$sec);
    }
?>

Hi Andreas,

folgende Überlegung geht mir noch durch den Kopf (nach dem ich gestern noch mein Halbwissen weiter verwässert habe):

Mal angenommen, der Pic-Link wird über die Variable korrekt an das .tmp-File übergeben (was ich stark vermute), kann es doch nurn noch an der Verarbeitung durch meinen Webserver liegen (allerdings hat Werner das file auf seinem Server auch schon probiert ->selbes Ergebnis, bei mir im IPS WFE auch das selbe)?!
Innerhalb der API-Doku von HC funktioniert es ja. Nur was genau könnte da falsch laufen?

Boah, schwitz: ist das cool! Habs gelöst :smiley:

kann man sich hier anschauen. wenn man mit der Maus über die Graphen fährt, weden die zu dem Timestamp gehörigen Bilder der Webcam in den Tooltip geladen.
Noch ein bischen optimieren- einfach schick ganzbreitgrins

hallo Raketenschnecke,
das ist echt der hammer was du da mit highcharts zauberst. habe mir eben die charts auf deiner website angesehen.

gruß khc

ah, der Meister spricht :smiley:
KHC,

danke für die Blumen :slight_smile: - aber dank Deiner Vorlage klappt das ganz gut.
Ja, so langsam komm ich dahin, wo ich hin will :wink: Jetzt ist erstmal Finetuning angesagt (Zahlenformate, Farben, also mehr Design, das findet noch nicht so richtig mein Wohlgefallen)