Angular Fusioncharts数据格式化但未正确加载

Angular Fusioncharts数据格式化但未正确加载,angular,fusioncharts,Angular,Fusioncharts,我正在写一个股票应用程序——我有一个股票价值和日期的列表,我想用fusion图表绘制一个图表。 现在,我的数据如下所示: $scope.chartData = [ { "label": "2017-05-11 16:00:00", "value": "930.6" }, { "label": "2017-05-10", "value": "928.78" }, { "label": "2017-05-09", "value": "932.17" }, { "label": "2017-05-08

我正在写一个股票应用程序——我有一个股票价值和日期的列表,我想用fusion图表绘制一个图表。 现在,我的数据如下所示:

$scope.chartData = [ { "label": "2017-05-11 16:00:00", "value": "930.6" }, { "label": "2017-05-10", "value": "928.78" }, { "label": "2017-05-09", "value": "932.17" }, { "label": "2017-05-08", "value": "934.3" }, { "label": "2017-05-05", "value": "927.13" }, { "label": "2017-05-04", "value": "931.66" }, { "label": "2017-05-03", "value": "927.04" }, { "label": "2017-05-02", "value": "916.44" }, { "label": "2017-05-01", "value": "912.57" }, { "label": "2017-04-28", "value": "905.96" } ]
App.controller('StockController', [ '$scope', '$http', '$routeParams',
        '$rootScope', function($scope, $http, $routeParams, $rootScope) {
            $scope.dataSource ={};
            $scope.chartData = [];

            $scope.getStockData = function(stockID) {
                $scope.loading = true;
                $scope.content = false;
                $http.get('/stock', {
                    params : {
                        stockID : encodeURI(stockID)
                    }
                }).then(function(response) {
                    $scope.showError = false;
                    $scope.stock = response.data;
                    $scope.stockAvailable = true;

                    const r = response.data.dates.map((d, i) => Object.assign({
                          label: d,
                          value: response.data.stockValues[i]
                        }))

                    $scope.data = JSON.stringify(r, null, 10);
                    $scope.chartData = $scope.data;
                    $scope.dataSource = {
                            chart: {
                                "caption": "Price of the stock",

                            },
                            data: $scope.chartData
                            };

                }, function(response) {
                    $scope.showError = true;
                }).finally(function() {
                    // called no matter success or failure
                    $scope.loading = false;
                    $scope.content = true;

                  });
            };
        } ]);
控制器如下所示:

$scope.chartData = [ { "label": "2017-05-11 16:00:00", "value": "930.6" }, { "label": "2017-05-10", "value": "928.78" }, { "label": "2017-05-09", "value": "932.17" }, { "label": "2017-05-08", "value": "934.3" }, { "label": "2017-05-05", "value": "927.13" }, { "label": "2017-05-04", "value": "931.66" }, { "label": "2017-05-03", "value": "927.04" }, { "label": "2017-05-02", "value": "916.44" }, { "label": "2017-05-01", "value": "912.57" }, { "label": "2017-04-28", "value": "905.96" } ]
App.controller('StockController', [ '$scope', '$http', '$routeParams',
        '$rootScope', function($scope, $http, $routeParams, $rootScope) {
            $scope.dataSource ={};
            $scope.chartData = [];

            $scope.getStockData = function(stockID) {
                $scope.loading = true;
                $scope.content = false;
                $http.get('/stock', {
                    params : {
                        stockID : encodeURI(stockID)
                    }
                }).then(function(response) {
                    $scope.showError = false;
                    $scope.stock = response.data;
                    $scope.stockAvailable = true;

                    const r = response.data.dates.map((d, i) => Object.assign({
                          label: d,
                          value: response.data.stockValues[i]
                        }))

                    $scope.data = JSON.stringify(r, null, 10);
                    $scope.chartData = $scope.data;
                    $scope.dataSource = {
                            chart: {
                                "caption": "Price of the stock",

                            },
                            data: $scope.chartData
                            };

                }, function(response) {
                    $scope.showError = true;
                }).finally(function() {
                    // called no matter success or failure
                    $scope.loading = false;
                    $scope.content = true;

                  });
            };
        } ]);
图表的HTML部分:

<div ng-controller="StockController" ng-show="content">
        <fusioncharts width="100%" height="400" type="line"
            dataFormat="json" dataSource="{{dataSource}}"> </fusioncharts>
    </div>

所以我认为数据没有被加载到图表中。你知道为什么吗?

我设法解决了这个问题-问题是我使用了JSON.stringify,它添加了额外的行符号,使得JSON对于FusionCharts不可读

解决方案是简单地将我的值数组传递给图表数据:

const r = response.data.dates.map((d, i) => Object.assign({
                      label: d,
                      value: response.data.stockValues[i]
                    }))
$scope.dataSource.data = r;