Graphs in JS , error when entering BD data

Asked

Viewed 65 times

3

I have at hand a huge problem. I have some graphics on js, where I need the data entered into them to come from the database.

But the way the code js is built, I can’t find any way to assign the database data on the charts. However, it already assigns the database data to other variables js, to facilitate.

I’m still struggling . I hope someone can help me :/

ATTENTION: It is not simply replacing the variables one by one, but doing it in a way that the process is automatic, and whenever a value is added or changed in the database, the graph automatically changes. I thought about doing a cycle while or for , but I don’t know how!

Here is how variables are assigned in JS of the data from BD:

var row=[];
<?php
$graph=$conn->query("SELECT * FROM lucro")or die("erro");
if($graph->num_rows>0){
    ?>
    var num=<?php echo $graph->num_rows;?>;
      for(var i=0;i<=<?php echo $graph->num_rows; ?>;i++){
        row[i]=[];
      }
    <?php
    $i=0;
    while($row=$graph->fetch_assoc() and $i<=$graph->num_rows){
      $data=date('M',strtotime($row['data']));
      ?>
        row[0][<?php echo $i+1; ?>]="<?php echo $data; ?>";
        row[<?php echo $i; ?>][0]=<?php echo $row['lucro'];?>;

      <?php
    $i++;
    }
}?>
var i=0;

And here we have the code of the graph where I want to exchange for these variables:

//GRAFICO do lucro p/ANO
 var myConfig = {
  type: "bar",
  plotarea: {
    adjustLayout: true
  },
  scaleX: {
    label: {
      text: "em MILHÕES"
    },

  //AQUI EM BAIXO É ONDE QUERO INSERIR AS VARIAVEIS JS COM OS DADOS DA BD:
    labels: ["Jan", "Feb", "March", "April", "May", "June", "July", "Aug"]
  },
  series: [{

  //AQUI EM BAIXO É ONDE QUERO INSERIR AS VARIAVEIS JS COM OS DADOS DA BD:
    values: [20, 40, 25, 50, 15, 45, 33, 34]
  }]
};

zingchart.render({
  id: 'myChart',
  data: myConfig,
  height: "80%",
  width: "100%"
});
php javascript

  • Do you want me to update the table only on the refresh page or without refresh?

  • is equal ! I want to find a way to find a way to insert the JS variables that are receiving data from the database, into the graph, so that whenever I manipulate the data in the database, the graph data also changes!

1 answer

2

You can do it like this:

$labelsJS = array();
$valsJS = array();

while($row=$graph->fetch_assoc() and $i<=$graph->num_rows){
  $data=date('M',strtotime($row['data']));
  ?>
    row[0][<?php echo $i+1; ?>]="<?php echo $data; ?>";
    row[<?php echo $i; ?>][0]=<?php echo $row['lucro'];?>;

    $labelsJS[] = $data;
    $valsJS[] = $row['lucro'];
  <?php
   $i++;
}

$labelsJS = json_encode($labelsJS);
$valsJS = json_encode($valsJS);

Then in js do, I suppose here already see the variable $labelsJS and $datas declared and with the above inserted values:

var labels = <?= "JSON.parse('" .$labelsJS. "');"; ?>
var values = <?= "JSON.parse('" .$valsJS. "');"; ?>

//GRAFICO do lucro p/ANO
var myConfig = {
  type: "bar",
  plotarea: {
    adjustLayout: true
  },
  scaleX: {
    label: {
      text: "em MILHÕES"
    },
    labels: labels
  },
  series: [{
    values: values
  }]
};

Browser other questions tagged php javascript

You are not signed in. Login or sign up in order to post.