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

低版本浏览器自定义节点事件无法触发 #4422

Open
wangzhaomang opened this issue Aug 31, 2024 · 2 comments
Open

低版本浏览器自定义节点事件无法触发 #4422

wangzhaomang opened this issue Aug 31, 2024 · 2 comments

Comments

@wangzhaomang
Copy link

Describe the bug

@antv/[email protected]
低版本浏览器(Chrome:68.0.3436.0)自定义节点长宽超出一定范围后,超出范围的自定义节点部分无法触发任何绑定事件。
高版本浏览器(Chrome: 128.0.6613.113)没有此类问题。

1、html组件注册:
`Shape.HTML.register({
shape: 'cu-data-node',
width: 'auto',
height: 104,
html() {
const container = document.createElement('div');
container.setAttribute('class', 'cu-container');
const item1 = document.createElement('div');
item1.setAttribute('class', 'cu-item');
const item2 = document.createElement('div');
item2.setAttribute('class', 'cu-item');
const item3 = document.createElement('div');
item3.setAttribute('class', 'cu-item');
const item4 = document.createElement('div');
item4.setAttribute('class', 'cu-item');
const item5 = document.createElement('div');
item5.setAttribute('class', 'cu-item');
const item6 = document.createElement('div');
item6.setAttribute('class', 'cu-item');
const item7 = document.createElement('div');
item7.setAttribute('class', 'cu-item');
const item8 = document.createElement('div');
item8.setAttribute('class', 'cu-item');
const item9 = document.createElement('div');
item9.setAttribute('class', 'cu-item');

  item1.innerHTML = '1';
  item2.innerHTML = '2';
  item3.innerHTML = '3';
  item4.innerHTML = '4';
  item5.innerHTML = '5';
  item6.innerHTML = '6';
  item7.innerHTML = '7';
  item8.innerHTML = '8';
  item9.innerHTML = '9';

  item1.addEventListener('click', () => {
    console.log('click 1');
  });

  item2.addEventListener('click', () => {
    console.log('click 2');
  });

  item3.addEventListener('click', () => {
    console.log('click 3');
  });

  item4.addEventListener('click', () => {
    console.log('click 4');
  });

  item5.addEventListener('click', () => {
    console.log('click 5');
  });

  item6.addEventListener('click', () => {
    console.log('click 6');
  });

  item7.addEventListener('click', () => {
    console.log('click 7');
  });

  item8.addEventListener('click', () => {
    console.log('click 8');
  });

  item9.addEventListener('click', () => {
    console.log('click 9');
  });

  container.appendChild(item1);
  container.appendChild(item2);
  container.appendChild(item3);
  container.appendChild(item4);
  container.appendChild(item5);
  container.appendChild(item6);
  container.appendChild(item7);
  container.appendChild(item8);
  container.appendChild(item9);
  return container;
}

});`

2、添加到画布:
graph.addNode({ shape: 'cu-data-node', x: 100, y: 40, width: 2800, height: 400 });

3、效果:
1725091102934

Your Example Website or App

暂无

Steps to Reproduce the Bug or Issue

暂无

Expected behavior

与高版本浏览器(Chrome: 128.0.6613.113)保持一致

Screenshots or Videos

No response

Platform

@antv/[email protected]
Chrome:68.0.3436.0

Additional context

No response

@x6-bot
Copy link
Contributor

x6-bot bot commented Aug 31, 2024

👋 @wangzhaomang

Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it.
To help make it easier for us to investigate your issue, please follow the contributing guidelines.
We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

@zlecheng
Copy link

zlecheng commented Sep 2, 2024

自定义节点长宽超出一定范围后

你这版本有点低啊,我们的项目最低都88以上了

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants