Question

我是stackoverflow的新手。我会尽可能地坚持指南。请理解我的英语，因为我不是母语人士。

我目前正在使用expressJS和ejs来构建图表。

我想做的是，我使用查询从mysql检索整个数据，然后将检索到的数据作为对象发送到ejs并使用该对象显示图表。

这是服务器端代码app.js.在这里，我检索整个查询行并发送名为data（第一个查询）的对象。

var express = require('express');
var app = express();
var path = require("path");
var mysql = require('mysql');

app.use(express.static(path.join(__dirname,'public')));
app.set('views',__dirname + '/views');
app.set('view engine', 'ejs');

app.listen(3000, function(){
  console.log("connected to the server");
});

app.get("/test",function(request,response){
  var connection = mysql.createConnection({ 
    host : '', //I have blinded personal info here
    user : '',
    password : '',
    database : '',
    port : '',
    multipleStatements: true
  });
  connection.connect(function(err){
    if(!err) {
      console.log("Database is connected ... \n\n");
    } else {
      console.log("Error connecting database ... \n\n");
    }
  });

  var queryS= 'SELECT active_program, SUM(activated_time) AS sumTime\
               FROM program_detail_logs\                
               GROUP BY active_program\
               ORDER BY sumTime DESC; SELECT created_at FROM program_detail_logs';

  connection.query(queryS, function(err, rows, fields) {
   if (!err){                      
      response.render('test', {data: rows[0], data2: rows[1]});
   }
   else{
     console.log('Error while performing Query.');
   }
   connection.end();
   });
});

这是test.ejs，用于制作图表的代码。

<canvas id="myChart" width="400" height="400"></canvas> //html part, where chart goes

<script>
var progName = [];
progName = <%=data.active_program%>

var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
    labels: progName,
    datasets: [{
        label: 'Usage time',
        data: [1000, 2000],
        backgroundColor: [
        'rgba(255, 99, 132, 0.2)',
        'rgba(54, 162, 235, 0.2)',
        'rgba(255, 206, 86, 0.2)',
        'rgba(75, 192, 192, 0.2)',
        'rgba(153, 102, 255, 0.2)',
        'rgba(255, 159, 64, 0.2)'
        ],
        borderColor: [
        'rgba(255,99,132,1)',
        'rgba(54, 162, 235, 1)',
        'rgba(255, 206, 86, 1)',
        'rgba(75, 192, 192, 1)',
        'rgba(153, 102, 255, 1)',
        'rgba(255, 159, 64, 1)'
        ],
        borderWidth: 1
    }]
    },
    options: {
    scales: {
        yAxes: [{
        ticks: {
            beginAtZero:true
        }
        }]
    }
    }
});
</script>

为了使用这些值，我从app.js传递了作为图表的标签，我已经声明了一个名为progNames的数组，并将对象元素的值称为active_programs（MySQL表的属性），我将其指定为data.active_programs。但是，这似乎不起作用。

要检查值是否已从app.js正确传递，我已检查<%=data[0].active_program=%>的值是否打印良好。但是当我打印时 <%=data%>，打印如下： [object Object],[object Object],[object Object],[object Object],[object Object],[object Object]...等等。

为什么会这样？如何从MySQL返回值数组并将相同的数组分配给图表的标签（这适用于数据部分）？

非常感谢

NodeJS将MYSQL数组数据发送到ejs不起作用

0 个答案: