Sou iniciante e fiz um algoritmos para um dashboard contabilizar os erros de produção de peças e necessito incluir uma tabela e um gráfico mostrando por defeito, qual seria a distribuição dos erros entre 4 categorias (Não aplicável, defeito mínimo, defeito grande e peça inutilizável. Tenho que contabilizar pela quantidade o percentual de desperdício do processo. Fiz um código utilizando php e Chartjs (Sou júnior/iniciante) e a tabela esta sendo gerada conforme espero, incluindo o % de desperdício (quanto maior, pior). O problema é que gráfico não carrega corretamente as informações pois acho que a formatação dos números e a fórmula utilizada para gerar os percentuais do gráfico estão incorretos. Outra coisa que acontece é que o gráfico fica muito grande, o limite passa de 100% mesmo eu tentando restringir o tamanho e o percentual máximo das categorias (n Se alguém puder me ajudar eu agradeço).
Segue abaixo o código completo:
A tabela utilizada tem as seguintes colunas: Tipo da peça, erro, classifica (que é um select com 4 opções como você pode ver no script) e um campo valor_defeito que uso para contar ou somar (sempre 1 para todos os registros).
Pergunta
alternativo em
Boa tarde a todos,
Sou iniciante e fiz um algoritmos para um dashboard contabilizar os erros de produção de peças e necessito incluir uma tabela e um gráfico mostrando por defeito, qual seria a distribuição dos erros entre 4 categorias (Não aplicável, defeito mínimo, defeito grande e peça inutilizável. Tenho que contabilizar pela quantidade o percentual de desperdício do processo. Fiz um código utilizando php e Chartjs (Sou júnior/iniciante) e a tabela esta sendo gerada conforme espero, incluindo o % de desperdício (quanto maior, pior). O problema é que gráfico não carrega corretamente as informações pois acho que a formatação dos números e a fórmula utilizada para gerar os percentuais do gráfico estão incorretos. Outra coisa que acontece é que o gráfico fica muito grande, o limite passa de 100% mesmo eu tentando restringir o tamanho e o percentual máximo das categorias (n Se alguém puder me ajudar eu agradeço).
Segue abaixo o código completo:
A tabela utilizada tem as seguintes colunas: Tipo da peça, erro, classifica (que é um select com 4 opções como você pode ver no script) e um campo valor_defeito que uso para contar ou somar (sempre 1 para todos os registros).
===========================================================================
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
<?php
// Conexão com o banco de dados
$servername = "localhost";
$username = "root";
$password = "adm123";
$dbname = "defeitos";
$conn = new mysqli($servername, $username, $password, $dbname);
// Verifica se a conexão foi estabelecida com sucesso
if ($conn->connect_error) {
die("Falha na conexão: " . $conn->connect_error);
}
// Query para obter os valores necessários
$sql = "SELECT tipo_peca, COUNT(valor_defeito) AS total,
SUM(CASE WHEN classifica = '1 – Não aplicável THEN valor_defeito ELSE 0 END) AS na_count,
SUM(CASE WHEN classifica = '2 -– defeito minimo' THEN valor_defeito ELSE 0 END) AS nc_count,
SUM(CASE WHEN classifica = '3 – defeito grande' THEN valor_defeito ELSE 0 END) AS pc_count,
SUM(CASE WHEN classifica = '4 – peça inutilizavel' THEN valor_defeito ELSE 0 END) AS fc_count
FROM master_table
GROUP BY tipo_defeito";
$result = $conn->query($sql);
?>
</br>
<main class="content">
<div class="container-fluid p-0">
<h1 class="h3 mb-3"> Dashboard</h1>
</div>
</br>
<?php
if ($result->num_rows > 0) {
// Início da tabela com borda
echo "<table style='border: 1px solid black;'>
<tr style='background-color: black; color: white;'>
<th> tipo_peca</th>
<th style='text-align: center;'>Total</th>
<th style='text-align: center;'>1 – Não aplicável</th>
<th style='text-align: center;'>2 - defeito minimo</th>
<th style='text-align: center;'>3 - defeito grande</th>
<th style='text-align: center;'>4 - peça inutilizavel</th>
<th style='text-align: center;'>Level defeito (%)</th>
</tr>";
// Loop através dos registros
while ($row = $result->fetch_assoc()) {
// Cálculo do Level
$defeitoLevel = (($row['nc_count']) / $row['total'] - $row['na_count']) * 0.025 +
(($row['pc_count']) / $row['total'] - $row['na_count']) * 0.75 +
(($row['fc_count']) / $row['total'] - $row['na_count']) * 1;
// Determina a cor de fundo com base no Level
$defeitoColor = '';
if ($defeitoLevel >= 0 && $defeitoLevel <= 0.3) {
$defeitoLevel = '#f5b7b1';
} elseif ($defeitoLevel > 0.3 && $defeitoLevel <= 0.6) {
$defeitoColor = ' #f7dc6f';
} elseif ($defeitoLevel > 0.6 && $defeitoLevel <= 0.85) {
$defeitoColor = '#58d68d';
} elseif ($defeitoLevel > 0.85 && $defeitoLevel <= 1) {
$defeitoColor = '#5dade2';
}
// Arredonda o valor do Compliance Level e remove as casas decimais
$defeitoLevel = round($defeitoLevel * 100);
// Exibição dos valores na tabela com formatação de cores
echo "<tr style='background-color: white;'>
<td>" . $row['tipo_peca'] . "</td>
<td style='text-align: center;'>" . $row['total'] . "</td>
<td style='text-align: center;'>" . $row['na_count'] . "</td>
<td style='text-align: center;'>" . $row['nc_count'] . "</td>
<td style='text-align: center;'>" . $row['pc_count'] . "</td>
<td style='text-align: center;'>" . $row['fc_count'] . "</td>
<td style='background-color: $defeitoColor; text-align: center;'>" . $defeitoLevel . "%</td>
</tr>";
}
// Fim da tabela
echo "</table>";
} else {
echo "Nenhum registro encontrado";
}
$conn->close();
?>
</br>
</br>
<!-- Elemento do canvas para renderizar o gráfico -->
<canvas id="radarChart"></canvas>
<script>
// Dados para o gráfico
var labels = [
<?php
// Loop através dos registros para obter as labels do gráfico
$result->data_seek(0);
while ($row = $result->fetch_assoc()) {
echo "'" . $row['tipo_peca'] . "',";
}
?>
];
var data = {
labels: labels,
datasets: [{
label: 'Defeito Level',
data: [
<?php
// Loop através dos registros para obter os dados das séries do gráfico
$result->data_seek(0);
while ($row = $result->fetch_assoc()) {
$complianceLevel = (($row['nc_count']) / $row['total'] - $row['na_count']) * 0.025 +
(($row['pc_count']) / $row['total'] - $row['na_count']) * 0.75 +
(($row['fc_count']) / $row['total'] - $row['na_count']) * 1;
//$complianceLevel = round($complianceLevel * 100);
echo $defeitoLevel . ",";
}
?>
],
backgroundColor: 'rgba(179, 181, 198, 0.2)',
borderColor: 'rgba(179, 181, 198, 1)',
pointBackgroundColor: 'rgba(179, 181, 198, 1)',
pointBorderColor: "#fff",
pointHoverBackgroundColor: "#fff",
borderWidth: 8
}]
};
// Configurações do gráfico
var options = {
scale: {
angleLines: {
color: 'black' // Define a cor das linhas do gráfico como preto
},
ticks: {
display: true, // Oculta os ticks (rótulos) do gráfico
beginAtZero: true,
min: 0,
max: 100
}
},
plugins: {
title: {
display: true,
text: 'Defeito Level', // Define o nome do gráfico
font: {
size: 18 // Define o tamanho da fonte do nome do gráfico
}
}
}
}
// Renderiza o gráfico
var ctx = document.getElementById('radarChart').getContext('2d');
new Chart(ctx, {
type: 'radar',
data: data,
options: options
});
</script>
</body>
</html>
Link para o comentário
Compartilhar em outros sites
1 resposta a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.