使用Ajax添加json數據到D3

Question

有人可以告訴我如何添加獲取的json數據和Ajax到D3嗎？ 我將這個例子https://github.com/samehelhakim/D3-saChart---Bilevel-Partition實現到我的項目中，只是想用我的數據填充輻射。下面是一個屏幕截圖與實際二層徑向佈局：

的問題是，我必須從dinamically網址，以獲取JSON，下面的屏幕截圖來自URL我的JSON數據：

這裏是捲曲的反應，如果這能幫助： curl 'http://127.0.0.1:5000/api/files/3/domains' -H 'Host: 127.0.0.1:5000' -H 'User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:43.0) Gecko/20100101 Firefox/43.0' -H 'Accept: application/json, text/javascript, */*; q=0.01' -H 'Accept-Language: en-US,en;q=0.5' --compressed -H 'X-Requested-With: XMLHttpRequest' -H 'Referer: http://127.0.0.1:5000/file/3' -H 'Cookie: session=.eJw9kM2KwkAQhF9lmbOHdZJcAh6ESUKE7mCYGLovwq5RMz-7EBXjiO--g4c9VhV8VNVT7I_TcDmL_DrdhoXYjweRP8XHl8gFVEWgYJNG2ZTNNo1asqIM-tI1-mxIl4ZVa8GjJ1PM3LcewsaR75JGnxIKhxHNKcNqN0LfBdbt2Oj6jsFKroro04yylmzYYXCOTRezdQK-9NSXBtXGouyWGLoUjHOk6wfrLmPPvtHOki5iL2dB0kq8FuL7Mh331187_PxPoB4-IdADKgpc7UxEzaDqOU65o4YE-50D3To0bUQWS1ZbievVG3e7DNP7DrEUrz_1nGGI.CXkyKA.wxR75Mly8-Ohvld90-z4CuIenzg' -H 'Connection: keep-alive' -H 'Cache-Control: max-age=0' {"data": [{"count": 1, "disabled": 0, "file_id": 3, "name": "11.client-channel.google.com"}, {"count": 1, "disabled": 0, "file_id": 3, "name": "clients4.google.com"}, {"count": 2, "disabled": 0, "file_id": 3, "name": "likeabosh.hipchat.com"}, {"count": 1, "disabled": 0, "file_id": 3, "name": "609.talkgadget.google.com"}, {"count": 1, "disabled": 0, "file_id": 3, "name": "12.client-channel.google.com"}, {"count": 9, "disabled": 0, "file_id": 3, "name": "smetrics.allstate.com"}, {"count": 1, "disabled": 0, "file_id": 3, "name": "calendar.google.com"}, {"count": 1, "disabled": 0, "file_id": 3, "name": "ps499ee8d0.pubnub.com"}, {"count": 1, "disabled": 0, "file_i

這是我如何設法獲取使用jQuery的Ajax從URL數據：

$(document).ready(function(){ 
    $.ajax({ 
     type: "GET", 
     contentType: "application/json; charset=utf-8", 
     url: '{{ url_for("diffs.api_domains", file_id=file.id) }}', 
     dataType: 'json' 
    }); 
}) 

您可以在此處看到d3佈局的代碼：https://github.com/samehelhakim/D3-saChart---Bilevel-Partition/blob/master/index.html。有一部分是d3.json("expanses.json", function(error, root) {，我在想我必須在那裏插入我提取的數據。

請讓我知道如果您需要關於此問題的其他信息，我希望我解釋正確。

Answer 1

是的，你可以使用d3.json去獲取數據，然後用它來填充圖表，無論你需要什麼方式。例如：

$.ajax({ 
    type: "GET", 
    contentType: "application/json; charset=utf-8", 
    url: '{{ url_for("diffs.api_domains", file_id=file.id) }}', 
    dataType: 'json' 
}).done(function (resp) { 
    // Transform data as you need it and do all the d3 layout in here 
    d3.selectAll('.wedge') 
     .data(resp) 
     .enter().append(YADA) 
});