arrow (edges - Graph)

[joaofgf]

when using
edges: style: 'arrow'
and
nodes:
image: 'http://server/icon.png', shape: 'image'

the central image is not transparent
example: http://i60.tinypic.com/2qu6exs.png
without 'arrow' style, transparent png: http://i61.tinypic.com/zo6rmd.png
thanks.

[AlexDM0]

Hi Joaofgf,

The image actually is transparent, the lines are just drawn to the edges of the image object. I am not sure if we can set the arrows to connect to the opaque edges of an image, instead of the containing box. However, for the side of the line that does NOT have the arrowhead, we can make that connect to the center of the object. This would be a partial fix, though in your example it should fix the problem. I'll discuss this with the team on monday.

Regards,

Alex

[joaofgf]

Thank you very much Alex.
Another issue Im dealing with is that i cant get the navigation buttons to
show up in the graph (same graph options).
Anyway, thank you again and please keep up with your excellent library.
Kind regards

Enviado do meu iPhone

No dia 08/03/2014, às 10:44, Alex notifications@github.com escreveu:

Hi Joaofgf,

The image actually is transparent, the lines are just drawn to the edges of
the image object. I am not sure if we can set the arrows to connect to the
opaque edges of an image, instead of the containing box. However, for the
side of the line that does NOT have the arrowhead, we can make that connect
to the center of the object. This would be a partial fix, though in your
example it should fix the problem. I'll discuss this with the team on
monday.

Regards,

Alex

Reply to this email directly or view it on
GitHubhttps://github.com//issues/55#issuecomment-37094722
.

[AlexDM0]

Hi Joaofgf,
http://visjs.org/examples/network/20_navigation.html As you can see in this example, it seems to work on this end. If you could send me an HTML file with your options and settings so I can reproduce the problem I can check if there is a bug in vis.js or if I can point you to where you can fix it in your case.
Regards,
Alex

[joaofgf]

Thank you Alex.
The nodes and edges are dynamically generated by a php script.
Example:
var nodes = [
{id: '17', label:'Purwoto\nline 2', image: 'http://server/img/user-icon.png', shape: 'image'}
.....
]
var edges = [
{from: '17', to: '11', length: LENGTH_MAIN, color: 'green' , style: 'arrow', label: 'Testing'}
]
var options = {
stabilize: false,
navigation: true,
keyboard: true,
edges: {
width: 1
}
};
graph = new vis.Graph(container, data, options);

[AlexDM0]

did you include the vis css file?

[joaofgf]

Thats it. fixed ;)
Thank you very much!

João Ferreira

On Saturday, 8 de March de 2014 at 15:02, Alex wrote:

did you include the vis css file?

—
Reply to this email directly or view it on GitHub (#55 (comment)).

[AlexDM0]

You're welcome :). Ill add it (or clarify, unsure if it's in there
currently) to the documentation.

Thank you for using vis :).