I have the following issue: on the server side I am creating a graph. I would like to display this graph using the Sigma.js library. For reference, the generated data looks for example like this:
{ nodes:
[ { id: '423ed89a-491d-416b-9c19-13fcb6db45bc',
label: 'Nevens Jens',
x: 0.5935997352935374,
y: 0.36792555125430226,
size: 5,
color: '#fff' } ],
edges: [] }
In my Express app, I use the following code to render a Jade-page:
app.get('/network', function (req, res) {
//Function calls to generate graph
function someCallback(data) {
res.render('graph', {graphData: data});
}
}
Next, in my Jade file, I would like to assign this data to a variable so I can use it in a JavaScript file:
script(src='/javascripts/vendor/sigma.min.js')
script.
var graphData = '#{graphData}'
script(src='/javascripts/graph.js')
My JavaScript file looks like this:
$(document).ready(function () {
console.log(graphData.nodes);
console.log(graphData.edges);
var s = new sigma({
graph: graphData,
renderer: {
container: document.getElementById('graph-container'),
type: 'canvas'
}});
s.refresh();
});
The problem is, when I look at the console in the browser, it shows undefined
twice.
Is this a correct way of transferring data to a JavaScript file? Am I doing anything else wrong?
You're outputting the data
object as a String so you're probably seeing something like var data = '[Object object]'
in you outputted html.
Doing something like this in your jade template should fix this issue:
script.
var graphData = !{graphData}
Let me know that this helps!
Edit: Update with Adrian's comments
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.