y軸のスケールが匿名関数内で定義されていません

Question

以下のコードが私にとってうまくいかない理由がわかりません。

：私はD3 v4を使用しています。 Iはy軸に沿って配置され別個カスタムパス要素（すなわち、カスタム形状）を作成したいdisplayDataの各要素について

// DATA JOIN 
var dataJoin = vis.svg.selectAll(".group") 
    .data(vis.displayData); 

// ENTER + UPDATE 
var group = dataJoin.enter().append("g") 
    .attr("class", "group"); 

group.append("path") // ENTER 
    .attr("class", "line") 
    .style("opacity", 0.5) 
    .merge(group) // ENTER + UPDATE 
    .transition() 
    .duration(800) 
    .attr("d", function(d) { 
     return vis.y(d.beginDate); <------- vis.y() is undefined 
    }); 

。各パス要素は、y軸に沿った適切な点にパス要素を配置できるように、vis.y（）尺度を使用する必要があります。

ただし、vis.y（）は.attr関数呼び出しの中では未定義です。 なぜですか？私は他のD3ビジュアライゼーションをビルドしましたが（バージョン3を使用していましたが）、.attr関数呼び出しの内部でスケールを使用していました。なぜ今これに問題がありますか？

私は基本的に、y軸の別の場所から始まる各要素のカスタムパスをカスタムシェイプに追加しようとしています。私がこれを間違った方法で行っているような気がするなら、私に他の提案をお寄せください。

それは以下のスケール使用しています。データは以下のように構造化オブジェクトの配列です

vis.y = d3.scaleTime() 
    .range([vis.height, 0]); 

vis.y.domain([ 
    d3.min(vis.displayData, function(d) { return d.beginDate; }), 
    d3.max(vis.displayData, function(d) { return d.endDate; }) 
]); 

を：

var obj = { 
    name: d.Name, 
    type: d.type, 
    beginDate: d.beginDate, 
    endDate: d.endDate, 
    eventDate: d.eventDate 
}; 

Answer 1

私が起こっていたことが分かったが、それでも理由を説明することはできませんそれが起こっています。私は

.attr("d", function(d) { 
    return vis.y(d.beginDate); 
}); 

を定義している

ヴィスはヴィス

.attr("d", function(d) { return d.beginDate; }); 

未定義です：私は両方の例は、1行を除いて全く同じで、2つの例を提供するつもりです私が "定義された"対 "未定義"と言うときは、コードをステップ実行してreturn文を壊し、コンソールに "vis"と入力すると、あるケースではオブジェクトが返され、オブジェクトは未定義です。

何らかの理由でアプリケーションを実行する前にreturn文内でvis.y（）を宣言すると、visが定義されます。それ以外の場合はそうではありません。これらの操作は、壊れた作業と作業の両方の動作を示すはずです（しかし、JSが "ソース"ビューにどこに住んでいるか分からないので、実際のフィドルにブレークポイントを置くことはできませんでした。もう一度、唯一の違いは上の1行です。壊れ

（VISは未定義である）作業

https://jsfiddle.net/jtLp2wzg/

（VISが定義されている）

https://jsfiddle.net/39exh1s8/1/