classcraft / cytoscape.js-canvas Goto Github PK

It might be good to mention in the readme that this extension can be used to place a canvas under or over Cytoscape. The intro sentence makes it sound like it's just for the under case, until you see later that you can set the z-index.

i just paste the demo code, in my project but nothing happen, no error, background not rendered

Could you post a demo of how the notification badge works? thanks

Hi. I'm trying to render a graph from cytoscape into a canvas using Node.js but to get as PNG I need a browser context which actually I cannot have because I'm using it with Node.js (headless).

So I'm wondering if this extension works with package canvas so that way I can render the graph and store it into a file.

Thanks in advance

Any background image is not exported by cy.png() and friends. Is this because Cytoscape.js is not aware of the extension's canvas??

Hi,

Do you happen to know, if this extension can be used with dashs cytoscape extension?

https://dash.plotly.com/cytoscape

Im aware that you probably are not too familiar with dash, but I figured asking wouldn't hurt 😉

Thanks Volker

I've recently noticed some confusing behaviour when using the canvas extension to draw a shape behind an element. When the page is loaded while the devicePixelRatio of the window is not equal to one the element and associated shape are "out of line".

I notice this on normal displays with chrome and firefox when the resolution is increased by pressing "CMD =" (before the page is loaded) and on retina displays with chrome, firefox and safari.
If the resolution is decreased on a retina display by pressing "CMD -" until devicePixelRatio equals one the element and share can be made to line up on chrome and firefox (after reloading the page).
Safari does not change the devicePixelRatio when zooming the browser window instead it only shows the expected result when the devicePixelRatio is equal to one.

From what I could gather from the code the canvas extension does take the value of devicePixelRatio into account when calculating the dimensions of the canvas element.

How should I handle this issue? @maxkfranz @ANault

For your connivance I've created a demo based off this repo for you to try out:
https://github.com/wrnrlr/debug-canvas
Just clone and open the demo

What are the plans for the future of cytoscape-canvas? It looks like the API was removed in b404982#diff-e87e7733693f3468c9750b957e64b300L54, so it is entirely non-backwards-compatible. Will the API be replaced with something new?

If you substitute in the newest minified version of the Cytoscape js library it will not render in the same way (the background image is missing).

Suggested action: Readme update to reflect limiting the max version supported

Is there a way to add a on click event listener with some meta that can tell me what element has been clicked, so we can have some interactivity with the elements.

Hi,
I'm using cytoscape.js + cytoscape.js-canvas in a VS code extension. VS Code now strongly recommends a CSP policy: https://code.visualstudio.com/updates/v1_38#_warning-when-creating-webview-without-a-content-security-policy

cytoscape.js has the changes as of cytoscape/cytoscape.js#2318, it would be great if canvas had similar changes made.

I'll try and start this myself.