Myujth

I'm trying out Treant.js library for making tree structures. I've started with this example: https://github.com/fperucic/treant-js/tree/master/examples/basic-example, and if I manually declare the value for the chart, it works with no issues.

Now I want to load it with data received from a Django channel, but can't seem to find a solution.

This is the tag from html to which the tree chart should be loaded, with .js files loaded after it, as in the example from the link above ('load static' is called in the beginning of the file, and works for all other static files):

<div class="chart" id="basic-example"></div>

<script src="% static 'path.../raphael.js'%"></script>
<script src="% static 'path.../Treant.js'%"></script>

I tried changing the value of the variable 'content' like this:

content = 

var chart_config = 
 chart: 
 container: "#basic-example",

 connectors: 
 type: 'step'
 ,
 node: 
 HTMLclass: 'nodeExample1'
 
 ,
 nodeStructure: content

;

new Treant( chart_config );

someSocket.onmessage = function(e) 
 let event_data = JSON.parse(e.data);
 content = event_data.data;

;

I've checked if the 'event_data.data' is properly communicated through the channel, and if it's a valid JS object, and that all works. I presume this is quite a newbie question, but I'd appreciate any help :)

I haven't tried to reproduce the issue (sorry for that), but it seems you gotta define your content before calling new Treant().

So, I would try this:

someSocket.onmessage = function(e) 
 let event_data = JSON.parse(e.data);

 var chart_config = 
 chart: 
 container: "#basic-example",

 connectors: 
 type: 'step'
 ,
 node: 
 HTMLclass: 'nodeExample1'
 
 ,
 nodeStructure: event_data.data
 ;
 
 new Treant( chart_config );
;