Am Chart не загружает диаграмму после вызова ajax

Question

Я извлекаю данные из API, делая вызов ajax, а затем передаю эти данные в диаграмму. Я не могу отобразить диаграмму. Может ли кто-нибудь предложить мне, что может быть проблемой?

Это мой Аякс вызов

Вы можете увидеть после того, как Ajax вызова я пытаюсь нажать на переменный объем и пытаюсь добавить к диаграмме.

для справки, пожалуйста, найти в этой ссылке http://jsfiddle.net/w3vpc35o/41/

angular.module('amChartsDirectiveExample', ['amChartsDirective']).controller('amChartsController', function ($scope) { 
$scope.call = function(){ 
    $http({ 
      method: "get", 
      global: false, 
      async: true, 
      url: "server/test.php 
     }). 
     success(function(data) { 
     /*Assume data like like [{ 
     year: 2005, 
     income: 23.5, 
     expenses: 18.1 
    }, { 
     year: 2006, 
     income: 26.2, 
     expenses: 22.8 
    }, { 
     year: 2007, 
     income: 30.1, 
     expenses: 23.9 
    }, { 
     year: 2008, 
     income: 29.5, 
     expenses: 25.1 
    }, { 
     year: 2009, 
     income: 24.6, 
     expenses: 25 
    }]*/ 
    $scope.rest = data 
    $scope.amChartOptions = { 
    data:$scope.res , 
    type: "serial", 
    theme: 'black', 
    categoryField: "year", 
    rotate: true, 
    pathToImages: 'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/images/', 
    legend: { 
     enabled: true 
    }, 
    chartScrollbar: { 
     enabled: true, 
    }, 
    categoryAxis: { 
     gridPosition: "start", 
     parseDates: false 
    }, 
    valueAxes: [{ 
     position: "top", 
     title: "Million USD" 
    }], 
    graphs: [{ 
     type: "column", 
     title: "Income", 
     valueField: "income", 
     fillAlphas: 1, 
    }] 
} 
    }); 
} 


$scope.call(); 

    }); 

Answer 1

Вы не упомянули, если вы используете какую-то угловую обертку для amCharts или нет, но если нет, то может быть, вы назвали вар диаграммы = AmCharts.makeChart (. ..) перед завершением вызова ajax и вы забыли вызвать chart.validateData(); после?

будет в значительной степени поможет, если вы будете размещать здесь некоторый полный код, относящийся к этой проблеме

EDIT

Это кажется, что вы используете GrantMStevens/amCharts-Angular.

Используйте метод, упомянутый в documentation: «Обещание на основе диаграммы рендеринга» для решения данных в асинхронном: http://jsfiddle.net/w3vpc35o/83/

В общем, что вам нужно сделать, это создать ChartOptions, как это:

this.amChartOptions = $timeout(function(){ 
     return { 
      data: this.dataFromPromise(), 
      type: "serial", 
... 
}.bind(this), 1000) 

и извлечения данных в асинхронном используя что-то вроде этого:

this.dataFromPromise = function(){ 
    var deferred = $q.defer(); 

    $http({ 
     method : "GET", 
     url : "/server/endpoint" 
    }).then(function mySucces(response) { 
     deferred.resolve(response); 
    }); 

    return deferred.promise; 
};