Thanks for this! I'd like to extend this addon in my own code by introducin

Directory cytoscape-addon
1

Thanks for this!
I’d like to extend this addon in my own code by introducing some of the Layout extensions. I haven’t found a way to do this and was looking for some advice. I can add, e.g. cytoscape-fcose with @NpmModule, I can then import it with @JsModule, but how do I then call something like import fcose from 'cytoscape-fcose'; cytoscape.use(fcose)?
Thanks again!
Dan.

2

PS, I have been doing e.g. cytoscape.getElement().executeJavaScript("cy.cy.layout('grid')") which works (seemingly there’s a globally accessible cy) but for some reason there’s no cy.cy.use.

3

I posted a fuller question here: https://vaadin.com/forum/thread/18453065

4

Hi Dan,

this is not a full solution (I am currently busy) but maybe a direction until I have more time next week.

-Download the cytoscape source code from the repository
-Add the js file from the extension to cytoscape-element.js
-Call the use method in the constructor in cytoscape-element.js

BR
martin

5

Thanks Martin!
I managed to solve my initial problem (being able to call cytoscape.use) by figuring out the necessary import statement. The library is brought in to @vaadin/flow-frontend when imported with @JsModule, but where @NpmPackage isn’t used.

I think your solution will be helpful if I need to customise any other aspects.

Thanks, Dan.

6

Hey Dan,

I’ve been trying to figure out how to use a cytoscape graph in my Vaadin webapp for a while now and like you I’ve found that this add-on is probably my best bet. I’m also having trouble trying to call cytoscape.use and can’t find answers anywhere except you’re comment here. I’m a little confused as to the solution you’ve posted on your thread on the forum. Could you point me toward some resources that might help me out a little bit?

-Alistair