rete icon indicating copy to clipboard operation
rete copied to clipboard

Unable to use AutoArrangePlugin with Angular 17 as schemes mismatch

Open gundupatil opened this issue 11 months ago • 7 comments

Is it possible to use the auto Arrange plugin for the below mentioned scheme. Auto Arrange only works when nodes have fixed height and width

type Schemes = GetSchemes<
  ClassicPreset.Node,
  ClassicPreset.Connection<ClassicPreset.Node, ClassicPreset.Node>
>;

Scheme given for AutoArrange plugin

class Node extends ClassicPreset.Node {
  width = 180;
  height = 120;
}

class Connection<N extends Node> extends ClassicPreset.Connection<N, N> {}
type Schemes = GetSchemes<Node, Connection<Node>>;

Is there a efficient way I can re arrange all the nodes having different schemes tried with zoom functionality area.area.transform.k also area.area.zoom()

dragged values will not be repositioned to initial state Help is appreciated

gundupatil avatar Feb 27 '24 18:02 gundupatil

what TS error do you receive?

The app generated via Rete Kit doesn't throw any error on build

npx rete-kit app -n ang17 -s angular -v 17 -f "Angular render,Order nodes,Zoom at,Auto arrange,Dataflow engine,Selectable nodes"

Ni55aN avatar Mar 06 '24 18:03 Ni55aN

what TS error do you receive?

The app generated via Rete Kit doesn't throw any error on build

npx rete-kit app -n ang17 -s angular -v 17 -f "Angular render,Order nodes,Zoom at,Auto arrange,Dataflow engine,Selectable nodes"

Sorry my question was Is it possible to use the auto Arrange plugin for the below mentioned scheme. Auto Arrange only works when nodes have fixed height and width?

gundupatil avatar Mar 07 '24 06:03 gundupatil

Trying the hack around to get the height and width of the node after the autoArrange

setTimeout(async () => {
        editor.getNodes().forEach(async (node) => {
          const nodes: NodeListOf<HTMLElement> = document.querySelectorAll(`node-${node.id}`);
          nodes.forEach(node => {
            node.style.height = 'auto';
            node.style.width = ' 288px';
          })
        })
      
    },500);
    await arrange.layout({ applier: animate ? applier : undefined });
      AreaExtensions.zoomAt(area, editor.getNodes());
    },

gundupatil avatar Mar 12 '24 08:03 gundupatil

only works when nodes have fixed height and width?

yes, because Elk.js (the library it's based on) needs width/height to be available before rendering the graph (in most cases).

after the autoArrange

why can't you specify/calculate width/height based on node type and content? Like this https://github.com/retejs/rete-studio/blob/abd5d890c56a748d501ef7c027671dcea3d37908/core/src/nodes.ts#L219

Ni55aN avatar Mar 27 '24 20:03 Ni55aN

assigning node height and width directly did not work.. need to modify node style height and width only.

gundupatil avatar Apr 12 '24 12:04 gundupatil

height and width directly did not work

this works if you don't use arrange.layout (or call area,resize directly)

Otherwise, after updating these properties, you need to call resize explicitly

Ni55aN avatar Apr 14 '24 10:04 Ni55aN

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 10 days.

rete-js[bot] avatar Jun 16 '24 01:06 rete-js[bot]

This issue was closed because it has been stalled for 10 days with no activity.

rete-js[bot] avatar Jul 07 '24 01:07 rete-js[bot]