X6 图表 执行 样式 设置 代码示例

以下是一个设置 X6 图表执行样式的代码示例：

const graph = new Graph({
  container: document.getElementById('graph-container'),
  grid: true,
});

// 定义节点
const rect = graph.createNode({
  shape: 'rect',
  width: 80,
  height: 40,
  attrs: {
    body: {
      fill: '#fff',
      stroke: '#000',
      strokeWidth: 1,
    },
    label: {
      text: 'Rect',
    },
  },
});

// 定义边
const edge = graph.createEdge({
  source: rect,
  target: rect,
  attrs: {
    line: {
      stroke: '#000',
      strokeWidth: 1,
    },
  },
});

// 设置执行样式
const executeStyle = {
  name: 'execute',
  args: {
    fill: '#fff',
    stroke: '#000',
    strokeWidth: 1,
    lineDash: [6, 4],
  },
};

graph.executeAction('shape.rect', 'addExecutionStyle', executeStyle);
graph.executeAction('shape.edge', 'addExecutionStyle', executeStyle);

这个示例创建了一个 X6 图表，并定义了一个矩形节点和一个连接到自身的边。然后，使用 `executeStyle` 对象定义了一个执行样式，并将其应用于矩形节点和边。最后，使用 `executeAction` 方法将执行样式应用于指定的形状。