projectstorm / react-diagrams

a super simple, no-nonsense diagramming library written in react that just works
https://projectstorm.cloud/react-diagrams
MIT License
8.51k stars 1.17k forks source link

How can I be able two delete a link into the #876

Open LLOUIS03 opened 2 years ago

LLOUIS03 commented 2 years ago

Hi How can be able to delete a link beteween two node in the diagram?

Kutalia commented 2 years ago

Hello. You will be able to delete links if you use PathFindingLinkModel used in Smart Routing demo, works like this. You just click on the link and hit delete key.

dberardo-com commented 2 years ago

elaborating on @Kutalia 's answer, you should create a custom factory:

import { DefaultLinkFactory } from "@projectstorm/react-diagrams-defaults";
import { PathFindingLinkModel } from "@projectstorm/react-diagrams-routing";
import { CustomDefaultLinkModel } from "../../links/CustomDefaultLinkModel";
import { ListenerHandle } from "@projectstorm/react-canvas-core";

export class CustomDefaultLinkFactory extends DefaultLinkFactory<CustomDefaultLinkModel> {
  static NAME = "custom-default-factory";
  listener: ListenerHandle;

  constructor() {
    super(CustomDefaultLinkFactory.NAME);
  }

  generateModel(event): PathFindingLinkModel {
    return new PathFindingLinkModel();
  }
}

and you should create your custom PortModel and override the createLink method:

 createLinkModel(): LinkModel {
    // let factory = new PathFindingLinkFactory();
    let factory = new CustomDefaultLinkFactory();
    return factory.generateModel({});
  }

if you dont need a custom default link then simply use the commented line in the method override above.

NOTE: i dont know why, but you dont need to register the factory with the engine.

@Kutalia can you tell me why this works also without registration?