1

私は Draw2D.js の初心者です。3 つの子ラベルを持つ「Horizo​​ntalLayout」を作成しました。3 つの子ラベルを持つ「Horizo​​ntalLayout」の JSON を取得しようとしています。

次のような私のコード：

HTML:

<div id="gfx_holder" style="width: 3000px; height: 3000px; cursor: default"></div>

<pre id="json"
     style="overflow:auto; position:absolute; top:10px; right:10px; width:350; height:500; background:white; border:1px solid gray">
</pre>

JS:

var canvas = new draw2d.Canvas("gfx_holder");
var label1 = new draw2d.shape.basic.Label({text: "TEST123"});
var label2 = new draw2d.shape.basic.Label({text: "Label 2"});
var label3 = new draw2d.shape.basic.Label({text: "Label 3"});

var container1 = new draw2d.shape.layout.HorizontalLayout();
container1.add(label1);
container1.add(label2);
container1.add(label3);
container1.setGap(10);
container1.setStroke(2);

canvas.add(container1, 50, 10);

canvas.getCommandStack().addEventListener(function (e) {
    if (e.isPostChangeEvent()) {
        displayJSON(canvas);
    }
});

function displayJSON(canvas) {
       var writer = new draw2d.io.json.Writer();

       writer.marshal(canvas, function (json) {
       $("#json").text(JSON.stringify(json, null, 2));
   });
}

上記のコードは、次の出力で生成されます。

ここに画像の説明を入力

メソッドを呼び出して JSON を取得していますdisplayJSON(canvas)。しかし、私は親（HorizontalLayout）の形を取得しているだけで、子のラベルを取得していません。

displayJSON(canvas)メソッドを呼び出すことで、次の JSON を取得しています。

[
  {
    "type": "draw2d.shape.layout.HorizontalLayout",
    "id": "9c009d71-a2af-6c86-51c4-e9011c9a446d",
    "x": 198,
    "y": 122,
    "width": 184.390625,
    "height": 28,
    "alpha": 1,
    "angle": 0,
    "userData": {},
    "cssClass": "draw2d_shape_layout_HorizontalLayout",
    "ports": [],
    "bgColor": "none",
    "color": "#1B1B1B",
    "stroke": 2,
    "radius": 0,
    "dasharray": null,
    "gap": 10
  }
]

および子ラベルJSONを使用して図全体を取得したい。HorizontalLayoutでは、どうすれば入手できますか？その後、Draw2dグラフを表示する方法はJSON？

4

0 に答える 0