Tuesday, 30 May 2017

Accessing MongoDB Data via Node Express for use with D3.js

I'm new to Node.js, and the whole MEAN stack, and have been trying to send my server side data to the browser, so I can use it and manipulate it with my client-side JavaScript (D3.JS). I've become somewhat familiar with the Node Express Framework and have set up a simple example to test this method using the following three files.

db-connect.js

//Declare & Instantiate Connection Variables
var express = require('express');
var app = express();
var MongoClient = require('mongodb').MongoClient;
var url = 'my-connection-string'; //Hidden for obvious reasons, have tested
var busArray = []; //Declare Bus Array

//Create App Route & Connect To Database

exports.dbConnect = function dbConnect(req, callback) {
    MongoClient.connect(url, function(err, db) {
        if (err) {
            callback(err, null);
        } else {

            //Create Cursor. Responsible For Iterating Over Collection Records
            var cursor = db.collection('busdata').find();

            //Invoke Each Method - Iterates Over Each Record & Executes It's Code Block
            cursor.each(function(err, item) {
                if (item != null) {
                    if (item.stopDate == '04-04-17') {

                        busObj = {}; //Declare Object Literal

                        busObj.bus_id = item.bus_id;
                        busObj.stopDate = item.stopDate;
                        busObj.stopTime = item.stopTime;
                        busObj.totalIn = item.totalIn;
                        busObj.totalOut = item.totalOut;
                        busObj.lat = item.lat;
                        busObj.lng = item.lng;

                        busArray.push(busObj);


                    }
                }

            }); //End of cursor
            //Callback
            jsonString = JSON.stringify(busArray); //Stringify The Array
            callback(null, busArray);
        } //end of else
    }); //end of mongoclient connect
}

index.js - the route file

var express = require('express');
var router = express.Router();
var database = require('../public/javascripts/db-connect.js');

/* GET home page. */
router.get('/', function(req, res, next) {
    database.dbConnect(req, function(err, data) {
        if(err) {
            console.error(err);
        } else {
            res.render('index', {testString: JSON.stringify({'bus_id':3997}), busdata: data});
        }
    });
});

module.exports = router;

index.pug - Page that I'm sending to

doctype html
html
head
  title= 'Index Test Page'
  link(rel='icon', href='images/favicon.ico')
  link(rel='stylesheet', href='stylesheets/style.css')
body
  block content
      h1= 'Test Graph'
script(type='text/javascript').
  //var testString = !{testString}
  //console.log(testString)

  var myData = !{busdata}
  console.log(myData)

The final line console.log(myData) gives me undefined in my Google Chrome Console output. I figured this could be due to the asynchronous nature of the language so I tried creating a variable within db-connect.js and assigned it to a JSON Object called 'testJSON' with 6 objects.

I then passed it into my callback callback(null, testJSON), updated the stringify line and restarted the server. I was able to successfully log the properties of the JSON Object.

I've tried using setTimeout() merely as a test but to no avail. What is the proper way of waiting for the data to come back from the MongoDB?



via TomPlum

No comments:

Post a Comment