Ich versuche, Amcharts mit Daten von Node JS zu verwenden. Ich versuche, ein JSON als Teil der Antwort von Node-Server-Fliege an die Client-Seite zu übergeben, die ich Feed-Amcharts verwenden konnte, um ein Kreisdiagramm zu erstellen. Der Code ist wie unten -Verwenden von Amcharts mit NodeJS-Daten
app.js
var express = require('express');
var path = require('path');
var app = express();
var port = process.env.PORT || 5000;
var delivCount = require('./serv_delivered.js');
var serv_ontime = require('./serv_ontime.js');
var delayedCount = require('./serv_delayed.js');
var crtidelayedCount = require('./serv_crit_delayed.js');
var chartData = [{
"country": "Czech",
"litres": 301.9
}, {
"country": "Ireland",
"litres": 201.1
}, {
"country": "Germany",
"litres": 165.8
}, {
"country": "Pak",
"litres": 139.9
}, {
"country": "Austria",
"litres": 128.3
}, {
"country": "UK",
"litres": 99
}] ;
app.use(express.static(path.join(__dirname, 'public')));
app.set('views', __dirname + '/src/views');
var bookRouter= express.Router();
app.set('view engine','ejs');
app.get('/',function(req,res){
delivCount(function(error, res_deliv){
serv_ontime(function(error, res_ontime){
delayedCount(function(error, res_delayed){
crtidelayedCount(function(error, res_cdelayed){
res.render('index', {title: "Hellow From Render",
res: [res_deliv,res_ontime,res_delayed,res_cdelayed,chartData]
});
});
});
});
});
});
app.listen(port,function(err){
console.log('running server on port'+ port);
});
amchart5.js
var chart = AmCharts.makeChart("pie1", {
"type": "pie",
"theme": "light",
"dataProvider": [{
"country": "Czech",
"litres": 301.9
}, {
"country": "Ireland",
"litres": 201.1
}, {
"country": "Germany",
"litres": 165.8
}, {
"country": "Pak",
"litres": 139.9
}, {
"country": "Austria",
"litres": 128.3
}, {
"country": "UK",
"litres": 99
}],
"valueField": "litres",
"titleField": "country",
"balloon": {
"fixedPosition": true
},
"export": {
"enabled": true
}
});
Kann mir jemand helfen, die Chartdata verwenden, die ich von App schicke. js, um ein Kreisdiagramm zu erstellen?
Hinzufügen Screenshot korrekten Daten Validierung -
Ich nehme an, Sie meinten <%= res[4]%>, aber das funktioniert nicht. Wahrscheinlich, weil die <% %> Konvention, die wir verwenden, für .ejs Art von Dateien ist. Ich denke nicht, dass wir es direkt in unseren js-Dateien verwenden können. – Dalton2
wenn ich mich nicht irre ... beide '-' /' = 'funktioniert ... aber ja, ich habe nicht darauf geachtet, dass Sie in .js-Datei verwenden. Sie könnten eine Funktion erstellen, die chartData empfängt und diese Funktion von ejs aufruft ... Ich werde meine Antwort mit meinem Vorschlag aktualisieren –
Ich habe genau so verwendet. Debugging auch um zu überprüfen, ob die js-Datei ausgeführt wird oder nicht, es ist aber immer noch Diagramm wird nicht gerendert. Ich habe den Screenshot hinzugefügt, um zu zeigen, dass die Daten korrekt empfangen wurden. – Dalton2