从angualr.js中的外部json创建chart.js点

时间:2019-05-28 00:13:35

标签: json angularjs mongodb mongoose chart.js

我试图了解使用我的猫鼬制作的自定义api为chartjs创建数据点的正确angularjs方式。我已经阅读了几乎所有与该问题有关的所有帖子,并且下面只有一个建议没有给我错误,但是数组为空。

我正在尝试从json对象中获取“ X:#”,并将其存储到数组中并从中生成图表点。

已经尝试过: 成角度的建议。

使用.length建议循环到数组中。

$。getJson,$ scope.array = [];在ajax函数建议中将对象传递给数组。

home.js控制器:

app.controller('home', ['$scope', 'dashboard', 'database', function ($scope, dashboard, database) {

$scope.title = 'The Dashboard Project: Guest';//Page title
dashboard.title = $scope.title; //send to route.js


database.readData().then(function (object) {
    $scope.object = object.data;
    console.log($scope.object);
})

/* My attempt to pass json value into array
$scope.chartjsData = [];
angular.forEach($scope.object, function (value) {
    $scope.chartjsData.push(value.visit);
});
console.log($scope.chartjsData); //Array shows up empty
*/

//Charts.js with angularjs
$scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
$scope.series = ['Series A', 'Series B'];
$scope.data = //$scope.chartjsData;  //empty json array

[//replace this with above custom json array
    [65, 59, 80, 81, 56, 55, 40],
    [28, 48, 40, 19, 86, 27, 90]
]; 
$scope.onClick = function (points, evt) {
    console.log(points, evt);
};
$scope.datasetOverride = [{ yAxisID: 'y-axis-1' }, { yAxisID: 'y-axis-2' 
}];
$scope.options = {
    scales: {
        yAxes: [
            {
                id: 'y-axis-1',
                type: 'linear',
                display: true,
                position: 'left'
            },
            {
                id: 'y-axis-2',
                type: 'linear',
                display: false,
                position: 'right'
            }
        ]
    }
};

}]);

Database.js服务:

app.service('database', ['$http', function ($http) {

this.readData = function () {
    return $http({
        method: 'GET',
        url: 'http://localhost:4000/products/objects'
    }).then(function (response) {
        return response;
    })
}/*

}]);

Model.js猫鼬Api:

var mongoose = require('mongoose');
var Schema = mongoose.Schema;

let ProductSchema = new Schema({

//Accounts
firstname: { type: String, trim: '', max: 100 },
lastname: { type: String, trim: '', max: 100 },
device: { type: String },

x: { type: Number }, //get data for chart
y: { type: Date, default: () => { return new Date() } }, //get data for chart
});


module.exports = mongoose.model('Product', ProductSchema);

chartjs是2折线图。

预期的X:数字数组。

预期的Y:来自数组的动态月/日。从X&Y数组创建标签和点。

Y值无需仅解决X这个问题,我仍在尝试修复时间戳以使其正确显示在数据库中。

0 个答案:

没有答案