mxgraph在vue中无法获取container

Posted 2023-05-11

参考技术A container容器属性没有设置。
Container容器页面用一个dom节点将mxgraph与javascript结合。它可以使用document.getElementById在body中取得或者直接动态创建。dom节点传递到主函数中用于建立以下mxgraph例子。
vue系列产品为3D自然环境的动画制作和渲染提供了一系列的解决方案。vue系列有很多不同的产品，这是为了满足不同阶层的用户的需要：可以满足专业的制作工作室，同样也能满足3D自由艺术家。

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

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

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样式是可选的，并且禁用单元格的手动调整大小。