在g6中添加了g2水波图自定义节点 ，在updateNodeData时如何更新水波图

[zmoth]

这里自定义了一个node参照案例

import { Circle as GCircle } from '@antv/g'
import { render, renderToMountedElement, stdlib } from '@antv/g2'
import { Circle } from '@antv/g6'

export class WaterWaveNode extends Circle {
  _group

  onCreate() {
    const { value } = this.attributes
    const radius = this.shapeMap.key.style.r

    this._group = this.upsert(
      'chart-container',
      GCircle,
      {
        r: radius,
        fill: '#000',
        fillOpacity: 0.9,
      },
      this.shapeMap.key
    )

    renderToMountedElement(
      {
        x: -radius,
        y: -radius,
        width: radius * 2,
        height: radius * 2,
        type: 'liquid',
        data: value,
        margin: 0,
        autoResize: true,
        autoFit: true,
        interaction: { tooltip: false },
        style: {
          outlineBorder: 4,
          outlineDistance: 4,
          waveLength: 32,
        },
      },
      {
        group: this._group,
        library: stdlib(),
      }
    )
  }

  update(attr) {
    console.log(attr)
  }
}

使用以下进行数据的更新

 graph.updateNodeData([
      {
        id: `node-1`,
        style: { value: message.currentLiquidLevel },
      },
    ])

  graph.render()

节点是这么注册的

register(ExtensionCategory.NODE, 'water-wave', WaterWaveNode)

{
    id: 'node-1',
    type: 'water-wave',
    style: { size: size, x: 0, y: 0, fillOpacity: 0, value: 0 },
  },