Tenho uma página onde eu deveria apresentar dois gráficos e, embora os dois estejam funcionando, só o segundo gráfico aparece.
Nenhum erro aparece, simplesmente só aparece um dos dois gráficos como se o outro nem existisse.
Gráfico 1:
<?PHP
$PREV = mysqli_query($lnk, "Select JAN_PREV, FEV_PREV, MAR_PREV, ABR_PREV, MAI_PREV, JUN_PREV, JUL_PREV, AGO_PREV, SET_PREV, OUT_PREV, NOV_PREV, DEZ_PREV from qualite where KPI = 'KPI1' ");
$REAL = mysqli_query($lnk, "Select JAN_REAL, FEV_REAL, MAR_REAL, ABR_REAL, MAI_REAL, JUN_REAL, JUL_REAL, AGO_REAL, SET_REAL, OUT_REAL, NOV_REAL, DEZ_REAL from qualite where KPI = 'KPI1' ");
$resultPREV = mysqli_fetch_assoc($PREV);
$resultREAL = mysqli_fetch_assoc($REAL);
$ListaP = $resultPREV;
$ListaR = $resultREAL;
$ListaPTotal = array();
$ListaRTotal = array();
foreach ($ListaP as $i => $value) {
array_push($ListaPTotal, $value);
}
foreach ($ListaR as $i => $value) {
array_push($ListaRTotal, $value);
}
$html1 = "
<div id='container-tt' style='min-width: 310px; height: 400px; margin: 0 auto'></div>
<script type='text/javascript'>
Highcharts.chart('container-tt', {
chart: {
type: 'column'
},
title: {
text: 'KPI1'
},
xAxis: {
categories: [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec'
],
crosshair: true
},
yAxis: {
min: 0,
title: {
}
},
tooltip: {
shared: true,
useHTML: true
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
series: [{
name: 'Previsto',
data: [" . join(", ", $ListaPTotal) . "]
}, {
name: 'Realizado',
data: [" . join(", ", $ListaRTotal) . "]
}]
});
</script>
</div>";
echo $html1;
?>
O segundo gráfico:
<?php
$PREV2 = mysqli_query($lnk, "Select JAN_PREV, FEV_PREV, MAR_PREV, ABR_PREV, MAI_PREV, JUN_PREV, JUL_PREV, AGO_PREV, SET_PREV, OUT_PREV, NOV_PREV, DEZ_PREV from qualite where KPI = 'KPI2' ");
$REAL2 = mysqli_query($lnk, "Select JAN_REAL, FEV_REAL, MAR_REAL, ABR_REAL, MAI_REAL, JUN_REAL, JUL_REAL, AGO_REAL, SET_REAL, OUT_REAL, NOV_REAL, DEZ_REAL from qualite where KPI = 'KPI2' ");
$resultPREV2 = mysqli_fetch_assoc($PREV2);
$resultREAL2 = mysqli_fetch_assoc($REAL2);
$ListaP2 = $resultPREV2;
$ListaR2 = $resultREAL2;
$ListaPTotal2 = array();
$ListaRTotal2 = array();
foreach ($ListaP2 as $i => $value) {
array_push($ListaPTotal2, $value);
}
foreach ($ListaR2 as $i => $value) {
array_push($ListaRTotal2, $value);
}
$html2 = "
<div id='container-tt' style='min-width: 310px; height: 400px; margin: 0 auto'></div>
<script type='text/javascript'>
Highcharts.chart('container-tt', {
chart: {
type: 'column'
},
title: {
text: 'KPI2'
},
xAxis: {
categories: [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
'Sep',
'Oct',
'Nov',
'Dec'
],
crosshair: true
},
yAxis: {
min: 0,
title: {
}
},
tooltip: {
shared: true,
useHTML: true
},
plotOptions: {
column: {
pointPadding: 0.2,
borderWidth: 0
}
},
series: [{
name: 'Previsto',
data: [" . join(", ", $ListaPTotal2) . "]
}, {
name: 'Realizado',
data: [" . join(", ", $ListaRTotal2) . "]
}]
});
</script>
</div>";
echo $html2;
?>
E a página que apresenta os gráficos:
<!DOCTYPE html>
<html lang="pt-br" class="no-js">
<head>
<script src="code/highcharts.js" type="text/javascript"></script>
</head>
<body>
<!--É do highcharts -->
<script src="code/modules/exporting.js"></script>
<?php require_once("menu.php"); ?>
<!--Baner -->
<div class="parallax-window" data-parallax="scroll" data-image-src="img/header-metade.jpg" style="height: 300px;">
<div class="parallax-content container">
<h1 class="carousel-title" style="font-size: 50px;">QUALITÉ</h1>
<p>SISTEMA</p>
</div>
</div>
<!-- Main -->
<div class="content-lg container">
<div class="row margin-b-20">
<div class="col-sm-6">
<h2>Prev x Real Month</h2>
</div>
</div>
<div class="row">
<div class="col-sm-12 sm-margin-b-50">
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
include("conn.php");
require_once("graf-qualite-1.php");
require_once("graf-qualite-2.php");
?>
</div>
</div>
<div class="col-sm-4 col-sm-offset-1">
</div>
</div>
</div>
<?php require_once("footer.php"); ?>
</body>
</html>
Estou usando HIGHCHARTS.js para o gráfico.