Добавить дату под основными данными в Chart.js - PullRequest
0 голосов
/ 04 ноября 2019

Я пытаюсь добавить дополнительную информацию (Дата) под основными данными из chart.js. Я хочу отображать дату под основной информацией. Я попытался использовать массив внутри цикла while, но когда я сделал это, он добавил все данные в позицию [0] из массива, я не мог понять, как это исправить ...

Thisмоя диаграмма:

<script>
    var lbl = [<?php echo $labels; ?>];
    var ctx1 = document.getElementById('mychart1');
    var ctx2 = document.getElementById('mychart2');

    var myLineChart = new Chart(ctx1, {
        type: 'line', 
        data: {
          labels: lbl,
          datasets: [
            {
              label: "Corrente 1",
              data: [
                <?php 
                echo $datacor1;  
                ?>
              ],
              borderWidht: 6,
              borderColor: 'red',
              backgroundColor: 'transparent'
            },
            {
              label: "Corrente 2",
              data: [<?php echo $datacor2; ?>],
              borderWidht: 6,
              borderColor: 'blue',
              backgroundColor: 'transparent'
            },
            {
              label: "Corrente 3",
              data: [<?php echo $datacor3; ?>],
              borderWidht: 6,
              borderColor: 'green',
              backgroundColor: 'transparent'
            },
            {
              label: "Corrente Total",
              data: [<?php echo $datatotcor; ?>],
              borderWidht: 6,
              borderColor: 'black',
              backgroundColor: 'transparent'
            },
          ]            
        },
        options: {
          scales: {
            yAxes: [{
              ticks: {
                beginAtZero: true
              }
            }],
            xAxes: [{
              gridLines: {
                display: false
              }
            }]
          },

          title: {
            display: true,
            fontSize: 20,
            text: "Gráfico das Correntes"
          },

          labels: {
            fontStyle: "bold",
          },

          layout: {
            padding: {
              left: 0,
              right: 0,
              top: 0,
              bottom: 0
            }
          },
          tooltips: {
            callbacks:{
              //This is the part that I tried
              label: function(tooltipItems, data) { 
                return tooltipItems.yLabel + ' $tempo';
              }
            }
          },
          aspectRatio: 1,
          maintainAspectRatio: false
        }
    });

Это часть, в которой я получаю информацию из даты в моей базе данных:

if ($resultCheck > 0)
      {
        while ($row = mysqli_fetch_assoc($result))
        {
          $horario = $horario .'"'.(date('H:i:s', strtotime(str_replace('.', '-', $row['dias'])))). '",';

          $geral = $geral .'"'.(date('d/m/y', strtotime(str_replace('.', '-', $row['dias'])))). '",';
          $tempo = trim($horario, ",");
        }
      }

      $labels = trim($geral, ",");
      $tempo = trim($horario, ",");

В настоящее время я получаю что-то вроде этого:
30/10/19
CorrenteTotal: 19

И я хочу получить это:
30/10/19
CorrenteTotal: 19
Horario: 18: 04: 23

...