javascript - d3.js で歴史的なフリーズを描画する方法

Question

私はそのようなjsonオブジェクトを持っています:

{
"data":{
"2012-12-29":[
    {"Dir":112.5,"Spd":2,"Spl":7,"Max":16},
    {...}
    {"Dir":"null","Spd":0,"Spl":1,"Max":null}
],
"2012-12-20":[
    {"Dir":22.5,"Spd":2,"Spl":7,"Max":16},
    {...}
    {"Dir":"null","Spd":0,"Spl":1,"Max":null}
],
"2012-12-31":[
    {"Dir":90,"Spd":2,"Spl":7,"Max":16},
    {...}
    {"Dir":"null","Spd":0,"Spl":1,"Max":null}
],
...
}

各DATEを円で表したX軸に各DATEを描画したいと思います。Y 値は常に : 0、すべての円は X 軸上にあります。

D3.on("click",function (){...})内部データを表示するために各円に含めた後。

最初のステップでは、DATE のみの配列を作成します。

var list=[];
for (var keydate in DATA) {
    list.push(keydate);
    i++;
}

DATEを描きたいのですが、方法がわかりません。

var svg = d3.select(container)
    .append("svg")

svg.selectAll("circle")
   .data(list)
   .enter()
   .append("circle")