如何将值从Node.js服务器传递到HTML页面内的嵌入式Javascript代码？

Question

I'm working on this project in which i need to pass a data brought from Mysql database via Node js server to HTML page that has embedded Javascript code to use this data to draw a chart by using Chart.js library. 我正在从事这个项目，在这个项目中，我需要将通过Node js服务器从Mysql数据库中获取的数据传递到具有嵌入式Javascript代码的HTML页面，以便通过Chart.js库使用此数据绘制图表。 This is the node.js code: 这是node.js代码：

var express = require('express');
var router = express.Router();
var mysql = require('mysql');
var plotly = require('plotly')("qzzaz111", "ivonjyk1gd")


var connection = mysql.createConnection({
  host     : 'localhost',
  user     : 'root',
  password : '',
  database : 'arduinodb'
});
var count =false;

connection.connect();
/* GET home page. */
router.get('/', function(req, res, next) {

  connection.query('SELECT * from Patient', function(err, result) {
    if (!err) {

      res.render('index', { title: result});
     console.log('The solution is: ', result);

    }
    else {
        console.log('Error while performing Query.');
    }

and here the HTML page(index.ejs) where i want to use the "title" array values inside the script to fill the "data" array for the chart 这里是HTML页面（index.ejs），我要在脚本中使用“ title”数组值来填充图表的“ data”数组

<script src='/javascripts/Chart.min.js'></script>

  <link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>

<canvas id="buyers" width="600" height="400"></canvas>
<br>
<br>

<script>

  var buyerData = {
    labels : ["January","February","March","April","May","June"],
    datasets : [
      {
        fillColor : "rgba(172,194,132,0.4)",
        strokeColor : "#ACC26D",
        pointColor : "#fff",
        pointStrokeColor : "#9DB86D",
        data : [ 87,156,99,251,305,247]
      }
    ]
  }
  var buyers = document.getElementById('buyers').getContext('2d');
  new Chart(buyers).Line(buyerData);
</script>

So, if i tried to use "title" directly , nothing would show up in the page(blank page). 因此，如果我尝试直接使用“标题”，则该页面（空白页面）中将不会显示任何内容。 Any solution? 有什么办法吗？

Answer 1

Try this code if your data from database is array of int: 如果数据库中的数据是int数组，请尝试以下代码：

<script src='/javascripts/Chart.min.js'></script>

  <link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>

<canvas id="buyers" width="600" height="400"></canvas>
<br>
<br>

<script>

  var buyerData = {
    labels : ["January","February","March","April","May","June"],
    datasets : [
      {
        fillColor : "rgba(172,194,132,0.4)",
        strokeColor : "#ACC26D",
        pointColor : "#fff",
        pointStrokeColor : "#9DB86D",
        data : [<%= title %>]        //here 
      }
    ]
  }
  var buyers = document.getElementById('buyers').getContext('2d');
  new Chart(buyers).Line(buyerData);
</script>

If your data is not an array need to be mapped, eg. 如果您的数据不是数组，则需要映射。 using lodash map: 使用lodash地图：

router.get('/', function(req, res, next) {

         connection.query('SELECT * from Patient', function(err, result) {
                     if (!err) {

                         var data = .map(result, function(n) { //here using lodash
                             return n.id;
                         });

                         res.render('index', {
                             title: data
                         });
                         console.log('The solution is: ', result);

                     } else {
                         console.log('Error while performing Query.');
                     }

如何将值从Node.js服务器传递到HTML页面内的嵌入式Javascript代码？

问题描述

1 个解决方案

解决方案1
0 已采纳 2015-10-17 13:53:38

如何将值从Node.js服务器传递到HTML页面内的嵌入式Javascript代码？

问题描述

1 个解决方案

解决方案1 0 已采纳 2015-10-17 13:53:38

解决方案1
0 已采纳 2015-10-17 13:53:38