感谢您的阅读和与我共度时光。当我使用括号内的标签和数据值时,例如[“ pollo”,“ acqua”,“ verdure”]和[32、25、14],绘制了图形,但是如果我用数组替换这些值,则不会绘制任何图形。 chart.js版本= 2.8怎么了?预先感谢。
const http = require('http');
const mysql = require('mysql');
var Chart = require('chart.js');
const pool = mysql.createPool({
host: '127.0.0.1',
user: 'andrea',
password: 'password',
database: 'spesa',
charset: 'utf8'
});
//html string that will be send to browser
var template ="<html><head><title>Grafici Analisi Spesa</title><script src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js'></script></head><body><h1>Grafici Analisi Spesa</h1>{${table}}</body></html>";
var sqlQuery ='SELECT articolo,SUM(quantita)as quantita FROM registro GROUP BY articolo ORDER BY SUM(quantita) DESC LIMIT 0, 6';
function setResHtml(sql, cb){
pool.getConnection((err, con)=>{
if(err) throw err;
//con.query(sql+con.escape(idAlunno), (err, res, cols)=>{
con.query(sql, (err, res, cols)=>{
if(err) throw err;
var table = '';
var articoli = new Array();
var totQuantita = new Array();
//create html table with data from res.
for (var i = 0; i < res.length; i++) {
articoli.push(res[i].articolo);
totQuantita.push(res[i].quantita);
console.log(articoli[i] + " " + totQuantita[i]);
}
table = `<canvas id="myChart" width="400" height="400" ></canvas>`;
table+=`<script>
var barData = {
labels : articoli,
datasets : [
{
fillColor : "rgba(73,188,170,0.4)",
strokeColor : "rgba(72,174,209,0.4)",
data : totQuantita
}
]
}
// get bar chart canvas
var myChart = document.getElementById("myChart").getContext("2d");
// draw bar chart
new Chart(myChart).Bar(barData);
</script>`;
con.release();
return cb(table);
});
});
}
//create the server for browser access
const server = http.createServer((req, res)=>{
setResHtml(sqlQuery, resql=>{
reo = template.replace('{${table}}', resql);
res.writeHead(200, {'Content-Type':'text/html; charset=utf-8'});
res.write(reo, 'utf-8');
res.end();
});
}).listen(8081);