Dear all,
I have a code to display a line-graph which is display correctly in a Mac/PC but not in an iPhone/iPad.
The code is this:
<script type="text/javascript">
window.onload = function ()
{
var chart = new CanvasJS.Chart("chartContainer",
{
zoomEnabled: true,
panEnabled: true,
title:{ text: "Consum" },
legend: { horizontalAlign: "center", verticalAlign: "bottom" },
axisY:{ includeZero: false, interlacedColor: "rgba(144,238,144,0.2)", title: "KW", gridThickness: 0 },
data: data, // random generator below
});
chart.render();
}
var data = [];
var dataPoints = [
{ x: new Date('2014-01-21 11:52:34'), y: 0.23 },
{ x: new Date('2014-01-21 11:54:34'), y: 0.23 },
{ x: new Date('2014-01-21 11:56:34'), y: 0.23 },
{ x: new Date('2014-01-21 11:58:34'), y: 0.23 },
...
{ x: new Date('2014-01-23 08:49:34'), y: 0.14 },
{ x: new Date('2014-01-23 08:50:34'), y: 0.14 },
];
var dataSeries = { type: "line", showInLegend: true, legendText: "Consum P1 (12.02 KWh)" };
dataSeries.dataPoints = dataPoints;
data.push(dataSeries);
var dataSeries = { type: "line", showInLegend: true, legendText: "Mitjana de consum" };
var dataPoints = [
{ x: new Date('2014-01-21 11:52:34'), y: 0.28 },
{ x: new Date('2014-01-21 11:54:34'), y: 0.28 },
{ x: new Date('2014-01-21 11:56:34'), y: 0.28 },
...
{ x: new Date('2014-01-23 08:49:34'), y: 0.28 },
{ x: new Date('2014-01-23 08:50:34'), y: 0.28 },
];
dataSeries.dataPoints = dataPoints;
data.push(dataSeries);
</script>
<script type="text/javascript" src="canvasjs.min.js"></script>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
As I mention, the code works fine in PC/Mac but not in iPhone/iPad. Could you give me a hint on what am I doing wrong?
Thank you.
.
