1

ジョイントjsで水平線を作成する方法.ジョイントjsの2点間に単純な水平線を描きたい.誰かがその方法を教えてください.

私の論文は次のようになります:

  var paper = new joint.dia.Paper({
        el: $('#myholder'),
        width: w,
        height:h,
        model: graph,
        gridsize:4
    });
    var paper2 = new joint.dia.Paper({
        el: $('#myimage'),
        width: w,
        height:600,
        model: graph,
        interactive : false
    });

そして、次のような2本の水平線を作成しました:

  var line = V('line', { x1: 50, y1: 100, x2: 300, y2: 100, stroke: 'black' });
    V(paper.viewport).append(line);
    V(paper2.viewport).append(line);

しかし、行が紙に印刷されている間、私は紙に行を取得していません2

4

1 に答える 1

2

そのためのリンクを使用できます。

graph.addCell(new joint.dia.Link({
   source: { x: 50, y: 100 },
   target: { x: 300, y: 100 }
}))

または SVG:

var line = V('line', { x1: 50, y1: 100, x2: 300, y2: 100, stroke: 'black' });
V(paper.viewport).append(line);

VJointJS によってエクスポートされるグローバル変数であり、Vectorizer ( http://jointjs.com/api#v ) と呼ばれる SVG 操作を容易にするための小さなライブラリです。

別の行を別の紙に追加する場合 ( paper2)、最初の行を最初に複製する必要があることに注意してください。

V(paper2.viewport).append(line.clone())

そうしないと、からの行paperが取り出されてに追加されます。paper2そのため、行が表示されpaperなくなります。

于 2014-07-31T08:22:02.600 に答える