Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: WebGL engine rendering error #6765

Open
2 of 10 tasks
hh1412 opened this issue Feb 11, 2025 · 1 comment
Open
2 of 10 tasks

[Bug]: WebGL engine rendering error #6765

hh1412 opened this issue Feb 11, 2025 · 1 comment
Labels
waiting for maintainer Triage or intervention needed from a maintainer.

Comments

@hh1412
Copy link

hh1412 commented Feb 11, 2025

Describe the bug / 问题描述

在官网中使用webGL引擎 点击节点 节点应该渲染选中的状态 但是有时候渲染出来的效果是错的
https://g6.antv.antgroup.com/examples/behavior/select/#click
代码
import { Graph } from '@antv/g6';
import { Renderer as WebGLRenderer } from '@antv/g-webgl'
const data = {
nodes: [
{ id: 'node1', style: { x: 150, y: 250 } },
{ id: 'node2', style: { x: 350, y: 250 } },
{ id: 'node3', style: { x: 250, y: 250 } },
],
edges: [],
};

const graph = new Graph({
data,
renderer: () => new WebGLRenderer(),
behaviors: [{ type: 'click-select', multiple: true, trigger: ['shift'] }, 'drag-element'],
autoFit: 'center',
});

graph.render();

const prompt = document.createElement('div');
prompt.innerHTML = 👉 Press SHIFT to enable multiple selection;
prompt.style.position = 'absolute';
const container = document.getElementById('container');
container.appendChild(prompt);

未点击时
Image
点击时
Image
期望的效果
Image

Reproduction link / 复现链接

https://g6.antv.antgroup.com/examples/behavior/select/#click

Steps to Reproduce the Bug or Issue / 重现步骤

打开官网https://g6.antv.antgroup.com/examples/behavior/select/#click
将下列代码复制进去

-------------代码分割线----------------
import { Graph } from '@antv/g6';
import { Renderer as WebGLRenderer } from '@antv/g-webgl'
const data = {
nodes: [
{ id: 'node1', style: { x: 150, y: 250 } },
{ id: 'node2', style: { x: 350, y: 250 } },
{ id: 'node3', style: { x: 250, y: 250 } },
],
edges: [],
};

const graph = new Graph({
data,
renderer: () => new WebGLRenderer(),
behaviors: [{ type: 'click-select', multiple: true, trigger: ['shift'] }, 'drag-element'],
autoFit: 'center',
});

graph.render();

const prompt = document.createElement('div');
prompt.innerHTML = 👉 Press SHIFT to enable multiple selection;
prompt.style.position = 'absolute';
const container = document.getElementById('container');
container.appendChild(prompt);
-------------代码分割线----------------

点击节点 就复现了

Version / 版本

🆕 5.x

OS / 操作系统

  • macOS
  • Windows
  • Linux
  • Others / 其他

Browser / 浏览器

  • Chrome
  • Edge
  • Firefox
  • Safari (Limited support / 有限支持)
  • IE (Nonsupport / 不支持)
  • Others / 其他
@hh1412 hh1412 added the waiting for maintainer Triage or intervention needed from a maintainer. label Feb 11, 2025
@github-actions github-actions bot changed the title [Bug]: webGL引擎渲染错误 [Bug]: WebGL engine rendering error Feb 11, 2025
@hh1412
Copy link
Author

hh1412 commented Feb 11, 2025

元素为矩形时

未点击时
Image

点击时
Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
waiting for maintainer Triage or intervention needed from a maintainer.
Projects
None yet
Development

No branches or pull requests

1 participant