【V5】updateNodeData 更新节点样式不生效

[chris-deng]

antv/g6 v5

import { Graph } from '@antv/g6';

fetch('https://assets.antv.antgroup.com/g6/dagre-combo.json')
  .then((res) => res.json())
  .then((data) => {
    const graph = new Graph({
      container: 'container',
      autoFit: 'view',
      data,
      node: {
        type: 'circle',
        style: {
          size: 50,
          radius: 8,
          fill: '#fff',
          lineWidth: 1,
          stroke: 'green', // border
        },
        palette: {
          field: (d) => d.combo,
        },
      },
      edge: {
        type: 'cubic-vertical',
        style: {
          endArrow: true,
        },
      },
      combo: {
        type: 'rect',
        style: {
          radius: 8,
          labelText: (d) => d.id,
          lineDash: 0,
          collapsedLineDash: [5, 5],
        },
      },
      layout: {
        type: 'antv-dagre',
        ranksep: 50,
        nodesep: 5,
        sortByCombo: true,
      },
      behaviors: ['drag-element', 'drag-canvas', 'zoom-canvas'],
    });
    graph.on('node:click', e=>{
      graph.updateNodeData([{id: e.target.id, style: {halo: true, fill: 'red',stroke: 'yellow'}}])
      graph.draw()

    })

    graph.render();
  });

初始化config中定义了node 的填充色为 白色，点击节点更新节点填充色为 红色 不生效

发现只要是graphOptions定义过的样式，再次变更就不生效

如何解决呢

[resetsix]

状态的样式在state字段里，而不是style。style是普通的默认样式才使用。

文档：https://g6-next.antv.antgroup.com/manual/core-concept/state#%E8%AE%BE%E7%BD%AE%E5%85%83%E7%B4%A0%E7%8A%B6%E6%80%81

[xplloveyxl]

用update({
fill: 'red',stroke: 'yellow'
})

[xplloveyxl]

我有个需求，点击一个节点的时候要找到和他相连的线，要怎么做。。。我没找到方法

[resetsix]

我有个需求，点击一个节点的时候要找到和他相连的线，要怎么做。。。我没找到方法

可通过自定义behaviors实现，参考一下信息密度示例和实现。