anvaka / anvaka/ngraph

add dinamically new nodes : which API for PIXI graphics VS vivagraph?

Open
#31 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
No language data
Stars
1.5k
Forks
130
PR merge metrics
No merged PRs in 30d

Description

Hi,

I would like to to switch from vivagraph SVG rendering to webGL based on PIXI.
I am looking at the PIXI examples, but struggle to understand how the logic works respect to vivagraph.

In the PIXI example, you define a getNodeAt function on stage, to return the node at coordinates x,y.
But like that the stage is bounded to graphics, and while I can interact with coordinates, I can't interact with the graph object. So I don't know how to call graph.addNodes or createNodeUI to add new graphs elements.

So I tried to add a native PIXI event to the sprite of nodes themselves, when I initialise a new node - http://pixijs.download/v4.3.4/docs/PIXI.interaction.InteractionManager.html#event:click -
like:

```
function initNode(node) {

var bunny = new PIXI.Sprite.fromImage('2.png');
bunny.interactive = true;
bunny.on('tap', function(e) {
alert("tap!!");
});

graphics.addChild(bunny);

}

```
But, despite I don't see any error, it does not work and the event does not fire.
Only` stage.movedown` seems to work.

Instead, with Viva it was really great API, for I could just swtich the renderer engine between svg and webgl.

Could you show examples on how to handle adding or removing graph elements in pixigraphics ?
Can pixi rendering be integrated in vivagraph , instead of WebGL rendering ? Could someone show an example?
That would be ideal, for PIXI can already handle well all the webgl part.

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by reviewing the PIXI interaction documentation linked in the issue and the existing ngraph APIs named there: graph.addNodes, createNodeUI, and the initNode example. Reproduce why the node sprite's tap event does not fire, then determine whether examples can cover adding and removing graph elements and integrating PIXI rendering with vivagraph.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
computer-graphics, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
20/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.