×
Ir ao conteúdo
  • Cadastre-se

PHP Colocar gráfico que muda os valores ao clicar em um botão


Posts recomendados

Bom Dia Pessoal

 

Eu queria colocar um simulador de capacidade de produção, e pensei em fazer um post do valor dos botões, que corresponde á linha de produção (isso é que vai mudar de linha para linha)

porém se eu colocar o valor na query manualmente funciona, mas se colocar uma váriavel os dados não aparecem.

Quem souber a solução por favor ajude.

 

Funcionando -> QUERY COM INFORMAÇÕES INSERIDAS MANUALMENTE:

$sqlQuery = "SELECT linha, variante, tc, mês, id FROM tc_variante WHERE linha = '2N21' AND variante = 'V2' ORDER BY ID";

imagem.thumb.png.bc19d254e01a965abbe96118e70f1649.png

COM O POST ->

 

imagem.thumb.png.e48b4c1a4ea2d75a696f60969f34959f.png

O SUPOSTO ERA AO CLICAR NUM DOS BOTÕES CINZENTOS ELE ASSUMIR A LINHA COMO ACIMA ("2N21") E MOSTRAR OS DADOS DESSA LINHA MAS EU CLICO NO BOTÃO E A VARIÁVEL ASSUME O VALOR DO BOTÃO MAS O GRÁFICO NÃO MUDA.

 

CÓDIGO PÁG PRINCIPAL:

<?php
// Create connection
$conn = new mysqli('localhost', 'root', '', 'bootlenecks');
// Check connection
if ($conn->connect_error) {
  die("Connection failed: " . $conn->connect_error);
}

$sql = "SELECT DISTINCT linha FROM variantes";
$result = $conn->query($sql);
?>
<!DOCTYPE html>
<html>
<head>
<title>Bootlenecks Linhas</title>
<link rel="stylesheet" href="index.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/Chart.min.js"></script>

<h1>Simulador Capacidade Linhas</h1>
</head>
<body>
    <div id="chart-container">
        <canvas id="graphCanvas"></canvas>
    </div>
    <table>
    <tr>
    <form method="POST">
    <button class="a" type="submit" name="T_linha" value="2N20">2N20</button>
    <button class="b" type="submit" name="T_linha" value="2N21">2N21</button>
    <button class="c" type="submit" name="T_linha" value="2N22">2N22</button>
    <button class="d" type="submit" name="T_linha" value="2N23">2N23</button>
    <button class="e" type="submit" name="T_linha" value="2N24">2N24</button>
    <button class="f" type="submit" name="T_linha" value="2N25">2N25</button>
</button>
    <table align="center">
<tr>
<td align="center"><b>Linha:</td>
<td><select class="combo" size=1 name="Linha">
    <?php
     while($row = $result->fetch_assoc()) { ?>                
                    <option value="<?php echo $row['linha'] ?>"><?php echo $row['linha'] ?></option> <?php } ?>             
                    <td align="center"><b>Variante:</td>
<td><select class="combo" size=1 name="Variante">
<?php
$sql = "SELECT DISTINCT variante FROM variantes";
$result = $conn->query($sql);
while($row2 = $result->fetch_assoc()) { ?>  
?>

<option value="<?php echo $row2['variante'] ?>"><?php echo $row2['variante'] ?></option> <?php } ?>           
</select>
    <script>
        $(document).ready(function () {
            showGraph();
        });


        function showGraph()
        {
            {
                $.post("data.php",
                function (data)
                {
                    console.log(data);
                    var mês = [];
                    var linha = [];
                    var tc = [];

                    for (var i in data) {
                        linha.push(data[i].linha);
                        mês.push(data[i].mês);
                        tc.push(data[i].tc);
                    }

                    var chartdata = {
                        labels: mês, tc, linha,
                        datasets: [
                            {
                                label: 'Bootleneck Linha',
                                backgroundColor: '#49e2ff',
                                borderColor: '#46d5f1',
                                hoverBackgroundColor: '#CCCCCC',
                                hoverBorderColor: '#666666',
                                data: tc
                            }
                        ]
                    };

                    var graphTarget = $("#graphCanvas");


                    var barGraph = new Chart(graphTarget, {
                        type: 'bar',
                        data: chartdata
                    });
                });
            }
        }
        </script>

<div id="chart-container2">
        <canvas id="graphCanvas2"></canvas>
    </div>

    <script>
        $(document).ready(function () {
            showGraph2();
        });


        function showGraph2()
        {
            {
                $.post("data.php",
                function (data)
                {
                    console.log(data);
                     var mês = [];
                    var tc = [];

                    for (var i in data) {
                        mês.push(data[i].mês);
                        tc.push(data[i].tc);
                    }

                    var chartdata = {
                        labels: mês, tc,
                        datasets: [
                            {
                                label: 'Bootleneck Linha',
                                backgroundColor: '#49e2ff',
                                borderColor: '#46d5f1',
                                hoverBackgroundColor: '#CCCCCC',
                                hoverBorderColor: '#666666',
                                data: tc
                            }
                        ]
                    };

                    var graphTarget = $("#graphCanvas2");

                    var barGraph = new Chart(graphTarget, {
                        type: 'bar',
                        data: chartdata
                    });
                });
            }
        }
        </script>
</body>
</html>

 

CÓDIGO DATA.PHP (QUERY)

<?php
header('Content-Type: application/json');

$conn = mysqli_connect("localhost","root","","bootlenecks");

if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $linha = filter_input(INPUT_POST, 'T_linha');


$sqlQuery = "SELECT linha, variante, tc, mês, id FROM tc_variante WHERE linha = '$linha' AND variante = 'V2' ORDER BY ID";

$result = mysqli_query($conn,$sqlQuery);

$data = array();
foreach ($result as $row) {
	$data[] = $row;
}

mysqli_close($conn);

echo json_encode($data);



}
?>

 

Link para o comentário
Compartilhar em outros sites

Bom dia pessoal, eu tenho um sistema de gráficos onde ao clicar em um botão, supostamente o gráfico devia mostrar os valores do botão selecionado...

Porém tem um problema, eu criei um post onde o valor do botão vai para a Query SQL e ai eu coloco a variável do botão na consulta:

 

$sqlQuery = "SELECT linha, variante, tc, mês, id FROM tc_variante WHERE linha = '$linha' AND variante = 'V2' ORDER BY ID";

 

Só que o gráfico também vai buscar os valores à mesma Query, e quando vai, a Váriavel $linha ainda está vazia porque ele executa a consulta sempre primeiro do que o POST do botão (e então o valor da variável está sempre null).

 

Como eu faço para o gráfico só executar a consulta após eu clicar no botão, e assim a variável ter um valor

 

Código POST dos Botões:

<form method="POST" action="data.php">
    <button class="a" type="submit" name="botão" value="2N20">2N20</button>
    <button class="b" type="submit" name="botão" value="2N21">2N21</button>
    <button class="c" type="submit" name="botão" value="2N22">2N22</button>
    <button class="d" type="submit" name="botão" value="2N23">2N23</button>
    <button class="e" type="submit" name="botão" value="2N24">2N24</button>
    <button class="f" type="submit" name="botão" value="2N25">2N25</button>
</form>

 

Código dos Gráficos:

<script>
        $(document).ready(function () {
            showGraph();
        });

        function showGraph()
        {
            {
                $.post("data.php",
                function (data)
                {
                    console.log(data);
                    var mês = [];
                    var linha = [];
                    var tc = [];

                    for (var i in data) {
                        linha.push(data[i].linha);
                        mês.push(data[i].mês);
                        tc.push(data[i].tc);
                    }

                    var chartdata = {
                        labels: mês, tc, linha,
                        datasets: [
                            {
                                label: 'Bootleneck Linha',
                                backgroundColor: '#49e2ff',
                                borderColor: '#46d5f1',
                                hoverBackgroundColor: '#CCCCCC',
                                hoverBorderColor: '#666666',
                                data: tc
                            }
                        ]
                    };

                    var graphTarget = $("#graphCanvas");


                    var barGraph = new Chart(graphTarget, {
                        type: 'bar',
                        data: chartdata
                    });
                });
            }
        }
        </script>

 

Código SQL (data.php):

<?php
header('Content-Type: application/json');

$linha = filter_input(INPUT_POST, 'T_linha');

$conn = mysqli_connect("localhost","root","","bootlenecks");

$sqlQuery = "SELECT linha, variante, tc, mês, id FROM tc_variante WHERE linha = '$linha' AND variante = 'V2' ORDER BY ID";

$result = mysqli_query($conn,$sqlQuery);

$data = array();
foreach ($result as $row) {
	$data[] = $row;
}

mysqli_close($conn);

echo json_encode($data);

?>

 

 

Fotos do Index (Ao clicar em algum botão, o gráfico não assume os valores da BD):

imagem.thumb.png.97829ce5ab683bdc73f4a7b0efefe5b4.png

Link para o comentário
Compartilhar em outros sites

Em 19/01/2022 às 14:56, David Martinho disse:

Já não preciso mais, mas não consigo eliminar.

 

Pessoal, preciso da ajuda sim, eu é que tinha criado outro tópico e tinha dito que não precisava mais kkkkk

 

Mas continuo sem saber o que fazer por isso agradeço quem consiga ajudar pfv :)

Link para o comentário
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisa ser um usuário para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...

Ebook grátis: Aprenda a ler resistores e capacitores!

EBOOK GRÁTIS!

CLIQUE AQUI E BAIXE AGORA MESMO!