Edge target arrows not working in Cytoscape.js >=2.7.0

Question

I noticed that edge source or target arrows are missing when using the current unstable branch (2.7.0-unstable). The standard cy demo show below. Is this a known issue or has something changed?

Strickle

!(cloud.githubusercontent.com/assets/5722945/16018601/…) – Strickle

Answer 1

The default stylesheet was updated in 2.7 to have greater performance by default. This means that haystack edges are used by default, and haystacks support only mid arrows.

If you set your edges in your stylesheet to beziers, then you can use source and target arrows, e.g.

edge {
  curve-style: bezier;
  target-arrow-shape: triangle;
}

Benediction

It works. Thanks a lot. I am currently using Cytoscape.js >=2.7.0 for network virtualization. – Codicil

How do you set your edges in your stylesheet to beziers? – Mooncalf

style: { 'curve-style': 'bezier', /* ... */ } – Jamille

Answer 2

Use like this.

cy.edges('edge').style({
    "curve-style": "bezier",
    "target-arrow-shape": "triangle"
})

Tarango