SVG キャンバスを使用せずに、mxGraph Javascript のみを使用して、HTML でグラフをレンダリングする方法を探しています。ユーザーマニュアルには次のように書かれています。
mxGraph には、html を使用して完全にレンダリングする機能も含まれています。これにより、使用できる機能の範囲が制限されますが、より単純な図に適しています。」
ただし、次のことを試しましたが成功しませんでした。
var editor = new mxEditor();
var graph = new mxGraph(graphContElem, new mxGraphModel(), 'fastest'); // fastest maps to stricthtml
graph.setHtmlLabels(true);
graph.dialect = mxConstants.DIALECT_STRICTHTML;
editor.graph = graph;
editor.createGraph();
このセルの追加:
var prototype = new mxCell('<input type="text" value="test" />', new mxGeometry(0, 0, w, h), style);
prototype.setVertex(true);
... import cells ...
これにつながります:
<svg style="width: 100%; height: 100%; display: block; min-width: 1px; min-height: 1px;">
...
<g transform="translate(104,61)">
<foreignObject style="overflow:visible;" pointer-events="all" width="173" height="19">
<div style="display:inline-block;font-size:11px;font-family:Arial,Helvetica;color:#774400;line-height:1.2;vertical-align:top;white-space:nowrap;text-align:center;">
<div xmlns="http://www.w3.org/1999/xhtml" style="display:inline-block;text-align:inherit;text-decoration:inherit;">
<input type="text" value="test">
</div>
</div>
</foreignObject>
</g>
...
</svg>
私の目標は、フォーム エディターの開発です。したがって、グラフのセルは、入力フィールドなどの HTML ウィジェットまたは Web コンポーネントになります。
これはmxGraphで可能ですか? 前もって感謝します!