xly0n xly0n - 5 months ago 29
JSON Question

How to access JSON this atribute using cytoscape.js and qtip?

I'm trying to access a JSON atribute using cytoscape/qtip. Actually I got the following

<script>
$(function(){
var cy = window.cy = cytoscape({
container: document.getElementById('cy'),
ready: function(){
},
layout: {
name: 'circle',
padding: 10
},
style: [
{

selector: 'node',
css: {
'content': 'data(name)'
}
},
{
selector: 'edge',
css: {
'target-arrow-shape': 'triangle'
}
}
],
elements: {
nodes: [
{ data: { id: 'j', name: 'Jerry' } },
{ data: { id: 'e', name: 'Elaine' } },
{ data: { id: 'g', name: 'George' } }
],
edges: [
{ data: { source: 'j', target: 'e' } },
{ data: { source: 'g', target: 'j' } }
]
},
});

cy.elements().qtip({
content: function(){ return this.id(); },
position: {
my: 'top center',
at: 'bottom center'
},
style: {
classes: 'qtip-bootstrap',
tip: {
width: 16,
height: 8
}
}
});

});
</script>


When I run this I access the id JSON atribute. It simply shows a graph structure at the screen and when I click on the j node it shows j using qtip and this for each one of the nodes. But what I want to show is the name for each of the nodes when I click on each one instead of its id. I've tried to replace this.id() by this.name() but it does not work. I'm not so familiarized with jquery.

thanks for your atention

Answer

Try this:

content: function(){ return this.attr('name'); },