javascript - ラベル付きの力指向グラフ

Question

私はD3.jsにかなり慣れていないので、この例の私のバージョンが機能しない理由を理解しようとしています。この例も参考にしています。

私が収集できることから、問題は私のtick機能にあります。コメントアウトすると、svgオブジェクトがドキュメントに書き込まれますが、それを使用すると、svgは書き込まれません。

これが私のコードです：

// CSS STYLE
    。リンク {
        ストローク：#ccc;
    }
    .node {
        ポインタイベント：なし;
        font：10px sans-serif;
    }
//CSSスタイルを終了します

// JSINBODYを開始します
//データセット
var dataNodes =
[
    {id： "N1"、name： "First 1"、type： "Type 1"}、
    {id： "N2"、name： "Node 2"、type： "Type 3"}、
    {id： "N3"、name： "Node 3"、type： "Type 4"}
];

var dataLinks =
[
    {sourceId： "N1"、linkName： "Relationship 1"、targetId： "N2"}、
    {sourceId： "N3"、linkName： "Relationship 2"、targetId： "N1"}、
    {sourceId： "N2"、linkName： "Relationship 3"、targetId： "N1"}
];

var w = 960;
var h = 500;
varノード;
var link;
var root;

var svg = d3.select（ "body"）
            .append（ "svg"）
            .attr（ "width"、w）
            .attr（ "height"、h）;

var node_hash = [];
var type_hash = [];

nodeSet.forEach（function（d、i）{
    node_hash [d.id] = d;
    type_hash [d.type] = d.type;
}）;

linkSet.forEach（function（d、i）{
    d.source = node_hash [d.sourceId];
    d.target = node_hash [d.sourceId];
}）;

var force = d3.layout.force（）
              .charge（-1000）
              .nodes（dataNodes）
              .links（dataLinks）
              .size（[w、h]）
              .linkDistance（100）
              .on（ "tick"、tick）
              。始める（）;

varlinks = svg.selectAll（ "。glink"）
                .data（froce.links（））
                。入力（）
                .append（ "g"）
                .attr（ "class"、 "gLink"）
                .append（ "line"）
                .attr（ "class"、 "link"）
                .style（ "stroke"、 "＃ccc"）;

var node = svg.selectAll（ "。node"）
                .data（froce.nodes（））
                。入力（）
                .append（ "g"）
                .attr（ "class"、 "node"）
                .call（force.drag）;

ノード
    .append（ "circle"）
    .attr（ "x"、function（d）{
        dxを返します。
    }）
    .attr（ "y"、function（d）{
        dyを返す;
    }）
    .attr（ "r"、10）
    .style（ "fill"、 "white"）
    .style（ "stroke-width"、2）
    .style（ "ストローク"、 "黒"）
    .call（force.drag）;

関数tick（）{
    リンク
        .attr（ "x1"、function（d）{
            d.source.xを返します。
        }）
        .attr（ "y1"、function（）{
            d.source.yを返します。
        }）
        .attr（ "x2"、function {
            d.target.xを返します。
        }）
        .attr（ "y2"、function {
            d.target.yを返します。
        }）;

    node.attr（ "transform"、function（d）{
        return "translate（" + d.x + "、" + d.y + "）";
    }）;

};
// JSINBODYを終了します

どんな助けでもいただければ幸いです。