The issue has been closed

[Bug]: canvas:click will reset all elements's state #7005

mahoushoujoarale posted onGitHub

Describe the bug / 问题描述

https://github.com/antvis/G6/blob/v5/packages/g6/src/behaviors/click-select.ts

canvas:click will reset all elements's state because of this.getClearStates()

if (type === 'select') {
        Object.assign(states, this.getClearStates(!!unselectedState));
        const addState = (list: ID[], state: State) => {
          list.forEach((id) => {
            if (!states[id]) states[id] = graph.getElementState(id);
            states[id].push(state);
          });
        };
        addState(click, selectState);
        addState(neighbor, neighborState);
        if (unselectedState) {
          Object.keys(states).forEach((id) => {
            if (!click.includes(id) && !neighbor.includes(id)) states[id].push(unselectedState);
          });
        }
      } else Object.assign(states, this.getClearStates());

see https://github.com/antvis/G6/blob/v5/packages/g6/src/behaviors/click-select.ts

it's supposed to be like

else {
        const targetState = states[target.id];
        states[target.id] = targetState.filter((s) => s !== selectState && s !== neighborState);
        if (!targetState.includes(unselectedState)) states[target.id].push(unselectedState);
        neighbor.forEach((id) => {
          states[id] = states[id].filter((s) => s !== neighborState);
          if (!states[id].includes(selectState)) states[id].push(unselectedState);
        });
      }

in the next few lines

@Aarebecca

Reproduction link / 复现链接

No response

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

No response

Version / 版本

🆕 5.x

OS / 操作系统

macOS
Windows
Linux
Others / 其他

Browser / 浏览器

Chrome
Edge
Firefox
Safari (Limited support / 有限支持)
IE (Nonsupport / 不支持)
Others / 其他

Thanks for pointing this out — it does look like a bug. Would you be interested in submitting a PR to help fix it?

posted by yvonneyx 15 days ago

Sorry, guys, I've made a mistake, it's nothing to do with click-select but brush-select. brush-select listens on canvas:click, and clear all states of all elements. see https://github.com/antvis/G6/blob/v5/packages/g6/src/behaviors/brush-select.ts

graph.on(CanvasEvent.CLICK, this.clearStates);

  protected clearStates() {
    if (this.endPoint) return;

    this.clearElementsStates();
  }

protected clearElementsStates() {
    const { graph } = this.context;
    const states = Object.values(graph.getData()).reduce((acc, data) => {
      return Object.assign(
        {},
        acc,
        data.reduce((acc: Record<ID, []>, datum: ElementDatum) => {
          acc[idOf(datum)] = [];
          return acc;
        }, {}),
      );
    }, {});

    graph.setElementState(states, this.options.animation);
  }

@yvonneyx

posted by mahoushoujoarale 12 days ago

opened a PR for this

posted by Rey-Wang 11 days ago

Fund this Issue

$0.00

Funded

Pull requests

[Bug]: canvas:click will reset all elements's state #7005

Describe the bug / 问题描述

Reproduction link / 复现链接

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

Version / 版本

OS / 操作系统

Browser / 浏览器

Company

Community

Support

Connect