Bonjour à tous,
je recherche une méthode pour afficher les données historiques obtenue par le json suivant
http://192.168.1.x:y/json.htm?type=graph&sensor=temp&idx=idx&range=day
sur une page web.
J'ai essayé ce type de script:
https://canvasjs.com/javascript-charts/ ... jax-chart/
où il faut communiquer les données de domoticz du fichier json mais je n'y parviens pas
Malheureusement les recherches php et json sortent de nombreux résultats puisqu'il s'agit d'extension de fichier...
Auriez vous une suggestion?
Merci.
Recherche script/méthode pour afficher les données de domoticz sur une page web
Re: Recherche script/méthode pour afficher les données de domoticz sur une page web
Highcharts fait cela aussi
mais dans tous les cas il faudra pré traité les données json avant de les mettre en graphique
https://www.highcharts.com/docs/working ... ocessing#3
mais dans tous les cas il faudra pré traité les données json avant de les mettre en graphique
https://www.highcharts.com/docs/working ... ocessing#3
Re: Recherche script/méthode pour afficher les données de domoticz sur une page web
J'aimerais aussi faire ça, remonter une température de Domoticz sur un site. J'avais un peu regarder mais je suis pas très bon en développement.
Re: Recherche script/méthode pour afficher les données de domoticz sur une page web
cette fonction a été implémentée dans monitor
viewtopic.php?t=331&start=50#p3281
viewtopic.php?t=331&start=50#p3281
Re: Recherche script/méthode pour afficher les données de domoticz sur une page web
Bon voici un bout de code en php/html (absolument pas propre) et à adapter au cas par cas...
Ici cela fonctionne pour l'affichage d'une température (si cela peut servir)...
Ici cela fonctionne pour l'affichage d'une température (si cela peut servir)...
Code : Tout sélectionner
<!DOCTYPE HTML>
<html>
<head>
<?php
//Calcul min/max valeur
$min=10000;
$max=-10000;
function get_data($url,$what){
$output='[';
$json2 = file_get_contents($url);
$jsonIterator2 = new RecursiveIteratorIterator(new RecursiveArrayIterator(json_decode($json2, TRUE)),RecursiveIteratorIterator::SELF_FIRST);
$i=0;
foreach ($jsonIterator2 as $key => $val) {
$i++;
// $output.='[';
if(is_array($val)) {
// echo "$key:\n";
} else {
$t=($i-3)%4;
if (strlen($val)>10){// plus de 10 caractères => date
if (($timestamp = strtotime($val)) === false) {
// echo "La chaîne ($val) est boguée";
}else {
$Y=date('Y', $timestamp);
$m=date('m', $timestamp);
$d=date('d', $timestamp);
$h=date('H', $timestamp);
$i=date('i', $timestamp);
$output.="{ x: new Date($Y,$m,$d,$h,$i),";
}
}
if (is_float($val)){ //valeur flottante, ici la température rh est un string
$output.="y: $val},";
if ($val>$max){
$max=$val;
}
if ($val<$max){
$min=$val;
}
}
}
}
$output.="]";
// echo $min;
// echo $max;
return array($output,$min,$max);
}
$data=get_data('http://127.0.0.1:8080/json.htm?type=graph&sensor=temp&idx=62&range=day','te');
?>
<script type="text/javascript">
window.onload = function () {
var chart = new CanvasJS.Chart("chartContainer",
{
animationEnabled: true,
theme: "light2",
zoomEnabled: true,
title:{
},
axisY: {
title: "Température",
titleFontSize: 24,
postfix: "°C",
maximum: <?php echo ceil($data[2]+1);?>,
minimum: <?php echo floor($data[1]-1);?>,
},
data: [
{
type: "line",
dataPoints: <?php echo $data[0];?>
}
]
});
chart.render();
}
</script>
<script type="text/javascript" src="https://canvasjs.com/assets/script/canvasjs.min.js"></script></head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;">
</div>
</body>
</html>