amd 모듈/requirejs에서 d3 요청의 결과를 반환

Question

d3 request (이 경우 d3.json())을 실행하는 amd 모듈을 만들고 요청에서 데이터를 반환하려고합니다. 모듈이 데이터를 반환하기 전에 요청이 완료 될 때까지 기다리는 방법을 알아낼 수 없습니다. 결과적으로 데이터에 액세스하려고 할 때 주 프로그램에서 정의되지 않은 상태가 계속됩니다.

define(['app/args'], function(args){ 

    d3.json("resources/waterData.php?stn=" + args.stationID, function (error, data) { 

    var dataToReturn = {}; 

    //Do some stuff with data 

    return dataToReturn; 
    }); 

}); 

그게 내가하려는 일의 기본 구조입니다. 주요 문제는 데이터가로드 될 때 d3.json의 두 번째 인수가 콜백이므로 데이터를 반환하려고 할 때 모듈 외부로 전달되지 않는다는 것입니다. 콜백에서 데이터를 모듈 외부로 반환하는 방법을 알아낼 수 없었습니다.

Answer 1

실제 문제는 d3.json 함수가 비동기 적이므로 처리 된 데이터를 외부 함수에서 직접 반환 할 수 없다는 것입니다. 이 문제를 해결할 수있는 한 가지 방법은 데이터 자체 대신을 약속하는 을 반환하는 것입니다. d3.json 콜백을 사용하여 약속을 해결할 수 있으며, 데이터에 의존하는 다른 모듈은 자신의 콜백을 등록 할 수 있습니다.이 콜백은 약속이 해결되면 실행됩니다. 예를 들어

, 당신이 사용하는 경우 jQuery의 $.Deferred() 당신이 할 수있는 다음이 데이터를 사용하고자 할 때

define(['app/args', 'jquery'], function(args, $){ 

    // CREATE DEFERRED OBJECT 
    var deferred = $.Deferred(); 

    d3.json("resources/waterData.php?stn=" + args.stationID, function (error, data) { 

    var dataToReturn = {}; 

    //Do some stuff with data 

    // RESOLVE NOW THAT THE DATA IS READY 
    deferred.resolve(dataToReturn); 
    }); 

    // RETURN THE PROMISE 
    return deferred.promise(); 

}); 

것은 그런 다음 위의 모듈을 필요로하고, 일단 발사하는 리스너를 등록 할 수 있습니다 데이터 준비 완료 :

require(['nameOfYourModuleAbove'], function(deferred) { 

    deferred.done(function(data) { 
    // DO SOMETHING WITH YOUR DATA 
    }); 

})