Question

我刚刚在其网站上完成了MongoDB tutorial for nodejs，并且正在尝试构建一个非常简单的测试用例，用于通过AJAX将查询结果发送到Google Chart。

这是我用来生成查询的nodejs文件：

CODE：

var MongoClient = require('mongodb').MongoClient,
assert      = require('assert');

MongoClient.connect('mongodb://localhost:27017/crunchbase', function(err, db) {
assert.equal(err, null);
console.log('The app is now running');

var query      = {name:  { $regex: /^m/}, founded_year: { $gte: 2009 }};
var projection = {name: 1, founded_year: 1, _id: 0};
var cursor     = db.collection('companies').find(query);
cursor.project(projection);
});

我用于将光标加载到Google图表comes from this page的示例。

这是我用来生成图表的示例代码：

CODE：

<!DOCTYPE html>
<html lang="en">
<head>
<!--Load the AJAX API for Google Charts- -->
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script type="text/javascript">
  google.charts.load('current', {'packages':['table']});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {
    var jsonData = $.ajax({
        url: "http://localhost:27017/crunchbase",
        dataType: "jsonp",
        asynchronous: true
    }).responseText;

    var data = new google.visualization.DataTable(jsonData);
    var chart = new google.visualization.Table(document.getElementById("chartDiv"));
    chart.draw(data);

  }
</script>
</head>
<body>
<h1 style="text-align: center">Companies Starting With "M" Founded After 2009</h1>
<div id="chartDiv">
</div>
</body>
</html>

我目前在控制台中收到此错误消息：

错误消息：

Uncaught SyntaxError: Unexpected identifier    crunchbase?callback=jQuery1102076…_1481945533315&_=1481945533316:1

同样值得注意：我将dataType更改为jsonp，将asynchronous更改为true，以便收到错误消息，但这些与Google Charts示例给出的示例背道而驰，因此这可能是相关的。

如果我的代码有点粗糙，我很抱歉，这只是试图将MongoDB和Google Charts文档中的基本示例结合在一起并让它们起作用。

Answer 1

asynchronous: true - ＆gt;需要等待请求完成，
在尝试使用数据/绘制图表之前

请参阅.done - 尝试以下代码段...

google.charts.load('current', {'packages':['table']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
  $.ajax({
    url: "http://localhost:27017/crunchbase",
    dataType: "jsonp",
    asynchronous: true
  }).done(function (jsonData) {
    var data = new google.visualization.DataTable(jsonData);
    var chart = new google.visualization.Table(document.getElementById("chartDiv"));
    chart.draw(data);
  }).fail(function (jqXHR, textStatus, errorMessage) {
    console.log(errorMessage);
  });
}

使用AJAX / Jquery使用MongoDB Projection填充Google Chart

1 个答案: