mxgraph进阶---如何创建无边框的文本标签，该标签会自动调整为文本

Posted 2022-09-08 尔嵘

对于给定的图形和父级，可以如下实现：

var graph = new mxGraph(container);
var parent = graph.getDefaultParent();

如果要在每次更改其值后更改单元格大小，则需要覆盖第一个mxGraph.isAutoSizeCell：

graph.isAutoSizeCell = function(cell)

  var state = this.view.getState(cell);
  var style = (state != null) ? state.style : this.getCellStyle(cell);

  return this.isAutoSizeCells() || style['autosize'] == 1;
;

此实现使用一种新样式（自动调整大小），可以将其设置为1以启用自动调整单元格的大小，如下所示：

graph.getModel().beginUpdate();
try

  var v1 = graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30,
    'strokeColor=none;fillColor=none;resizable=0;autosize=1;');
  graph.updateCellSize(v1);

finally

  graph.getModel().endUpdate();

插入后，对updateCellSize的调用将单元格的大小显式更新为其首选大小。resizable = 0样式是可选的，并且禁用单元格的手动调整大小。