Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

162
Vistas
Make time as label for Chart.js

This is my first time working with Chart.js in order to make a chart for my data. I am looking to make a chart from some specific data from my database which I have exported in an array during the processing in php. However I feel kinda lost. So to be more specific:

I have an array that looks like this:

Array ( [0] => 2021-07-02 [1] => 2021-07-20 [2] => 
06:47 [3] => 23:47 [4] => 
09:47 [5] => 21:47 [6] => 
18:27 [7] => 21:47 [8] => 
03:47 [9] => 06:50 [10] => 
00:48 [11] => 21:48 [12] =>
171.2786 [13] => 170.9501 [14] => 170.2825 [15] => 173.1435 [16] => 171.4377 )

The first two elements are some datetimes and the following are time intervals selected by the user in order to calculate an average of the values between the inputs (an entry in the table looks like this):

+-------------+--------------------+------+-------+
| ID          | datetime           | Type | Value | 
+-------------+--------------------+------+-------+
| 202106250446| 2021-06-25 04:46:00| 0    | 194   | 
+-------------+--------------------+------+-------+

I want to make a chart that takes as label the time slots (like 1 label should look like 06:47-23:47) and and which has as its value the first number element (for this example 171.2786)

I parse this array from php with json (jvs is the name of the array)

<script type="text/javascript">
    var obj = <?php echo json_encode($jvs); ?>;
</script>

and opened a app.js file but I struggle understanding how to concatenate and write the labels and data (since it's my first time doing this)

$(document).ready(function(){
    $.ajax({
      url: "http://localhost/chartjs/average.php",
      method: "GET",
      success: function(jvs) {
        console.log(jvs);
        var interval = [];
        var average = [];
  
        { here is the part of code that cannot figure it out}
  
        var chartdata = {
          labels: interval,
          datasets : [
            {
              label: 'Interval chosen',
              backgroundColor: 'rgba(200, 200, 200, 0.75)',
              borderColor: 'rgba(200, 200, 200, 0.75)',
              hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
              hoverBorderColor: 'rgba(200, 200, 200, 1)',
              data: average
            }
          ]
        };

Thank you and please forgive me if I'm making rookie mistake, I'm still learning :D

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda