Hi guys
I have this chart element
<canvas class="main-chart" id="line-chart" height="200" width="600"></canvas>
and i have this script to insert the data
<script>
function hour(){
return a=["00:00","01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00",
"11:00","12:00","13:00","14:00","15:00","16:00","17:00","18:00",
"19:00","20:00","21:00","22:00","23:00"];
};
var data_visitors_present=<?php echo json_encode(visitorsPresentDay()[0]);?>;
var data_visitors_previous=<?php echo json_encode(visitorPreviousDay()[0]);?>;
var lineChartData = {
labels : hour(),
datasets : [
{
label: "My First dataset",
fillColor : "rgba(220,220,220,0.2)",
strokeColor : "rgba(220,220,220,1)",
pointColor : "rgba(220,220,220,1)",
pointStrokeColor : "#fff",
pointHighlightFill : "#fff",
pointHighlightStroke : "rgba(220,220,220,1)",
data : data_visitors_previous
},
{
label: "My Second dataset",
fillColor : "rgba(48, 164, 255, 0.2)",
strokeColor : "rgba(48, 164, 255, 1)",
pointColor : "rgba(48, 164, 255, 1)",
pointStrokeColor : "#fff",
pointHighlightFill : "#fff",
pointHighlightStroke : "rgba(48, 164, 255, 1)",
data : data_visitors_present
}
]
}
</script>
The final result is this
I want every 10 seconds to reload only the chart element;
I wrote this without effect…
<script>
var chart=document.getElementById('#line-chart');
setInterval(chart){(
function hour(){
return a=["00:00","01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00",
"11:00","12:00","13:00","14:00","15:00","16:00","17:00","18:00",
"19:00","20:00","21:00","22:00","23:00"];
};
var data_visitors_present=<?php echo json_encode(visitorsPresentDay()[0]);?>;
var data_visitors_previous=<?php echo json_encode(visitorPreviousDay()[0]);?>;
var lineChartData = {
labels : hour(),
datasets : [
{
label: "My First dataset",
fillColor : "rgba(220,220,220,0.2)",
strokeColor : "rgba(220,220,220,1)",
pointColor : "rgba(220,220,220,1)",
pointStrokeColor : "#fff",
pointHighlightFill : "#fff",
pointHighlightStroke : "rgba(220,220,220,1)",
data : data_visitors_previous
},
{
label: "My Second dataset",
fillColor : "rgba(48, 164, 255, 0.2)",
strokeColor : "rgba(48, 164, 255, 1)",
pointColor : "rgba(48, 164, 255, 1)",
pointStrokeColor : "#fff",
pointHighlightFill : "#fff",
pointHighlightStroke : "rgba(48, 164, 255, 1)",
data : data_visitors_present
}
]
}
}1000);
</script>
how i can fix it?