antvis/G6

G6中对于节点中有自定义图片的情形,在inactive状态降低透明度,图片的透明度不会降低 #4638

lovelyGFR posted onGitHub

问题描述

G6中对于节点中有自定义图片的情形,在inactive状态降低透明度,图片的透明度不会降低(svg)

重现链接

https://g6.antv.antgroup.com/zh/examples/item/customNode/#card

重现步骤

同上

预期行为

G6中对于节点中有自定义图片的情形,在inactive状态降低透明度,图片的透明度不会降低(svg)。期望节点内所有元素设置透明度后全部生效

平台

  • 操作系统: [macOS, Windows, Linux, React Native ...]
  • 网页浏览器: [Google Chrome, Safari, Firefox]
  • G6 版本: [4.5.1 ... ]

屏幕截图或视频(可选)

No response

补充说明(可选)

No response


canvas 有问题吗,建议用 canvas 哈,性能会更好

posted by Yanyan-Wang almost 2 years ago

canvas也是一样哎,我的Inactive是在data中的stateStyles直接改变的

stateStyles: {
      hover: {
          shadowColor: getNodeConfig(node.entityType).color.SHADOW_COLOR,
          shadowBlur: 100
      },
      active: {
          shadowColor: getNodeConfig(node.entityType).color.SHADOW_COLOR,
          shadowBlur: 100
      },
      selected: {
          lineWidth: 3
      },
      inactive: {
          opacity: 0.3
      }
  }

我的图片就是在draw里面通过addShape画出来的。 有没有比较完整的使用react+G6比较复杂的案例参考呀 @Yanyan-Wang

posted by lovelyGFR almost 2 years ago

自定义节点中的图形需要跟随状态样式,需要在状态样式中写哈,例如这里文档中的「子图形状态样式」:https://g6.antv.antgroup.com/manual/advanced/state-new

再不行的话,给个在线复现的 demo 看看

posted by Yanyan-Wang almost 2 years ago

canvas也是一样哎,我的Inactive是在data中的stateStyles直接改变的

stateStyles: {
      hover: {
          shadowColor: getNodeConfig(node.entityType).color.SHADOW_COLOR,
          shadowBlur: 100
      },
      active: {
          shadowColor: getNodeConfig(node.entityType).color.SHADOW_COLOR,
          shadowBlur: 100
      },
      selected: {
          lineWidth: 3
      },
      inactive: {
          opacity: 0.3
      }
  }

我的图片就是在draw里面通过addShape画出来的。 有没有比较完整的使用react+G6比较复杂的案例参考呀 @Yanyan-Wang

请问解决了吗?

posted by afc3liuyuan about 1 year ago

Fund this Issue

$0.00
Funded

Pull requests