title: Draw data in graphics generated by Chart JS
body: <p>Good afternoon.
  I'm working with Chart JS and I'm trying to show the existing total per column in a bar graph.</p>
  
  <p>In the backend I use Laravel as a framework and the data I pass from the controller through the <code>$datacount</code> variable.</p>
  
  <p>This is my query in the controller:</p>
  
  <pre><code>$datacount = DB::table('topics')
              -&gt;leftJoin('proposals_topics', 'topics.id', '=', 'proposals_topics.topic_id')
              -&gt;select('topics.name as tpcname', 'proposals_topics.topic_id', \DB::raw('count(topic_id) as total'))
              -&gt;groupBy('topics.name', 'proposals_topics.topic_id')
              -&gt;orderBy('topic_id', 'desc')
              -&gt;get();
  </code></pre>
  
  <p>The data of the variable I receive in this script:</p>
  
  <pre><code>&lt;script&gt;
     var datacount = &lt;?= json_encode($datacount, JSON_PRETTY_PRINT); ?&gt;;
  
     console.log(datacount);
  
     // Bar chart
     new Chart(document.getElementById("bar-chart"), {
         type: 'bar',
         data: {
         labels: ["Compras y Contrataciones", "Acceso a la Información", "Educación", "Organismos de Control", "Servicio Civil", "Infraestructura", "Energía", "Gestión Financiera", "Salud", "Agua"],
         datasets: [
             {
             label: "Cantidad generada",
             backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850","#ffc344","#ff8e17", "#ff4cd8","#ffea4c","#b7ff4c"],
             data: [datacount.total]
             }
         ]
         },
         options: {
         legend: { display: false },
         title: {
             display: true,
             text: 'Datos generados por eje temático.'
         }
         }
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>I am receiving the results in the console, but I can not show the data of the array.</p>
  
  <p><a href="https://i.stack.imgur.com/3pn36.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/3pn36.png" alt="enter image description here"></a></p>