2016-04-16 17 views
2

Ich versuche, eine Kraft gerichtete D3.js Grafik auf der Serverseite (wegen der Größe des verwendeten Datensatzes) zu rendern und es als eine Menge von Koordinaten der Stabiler Zustand des Graphen, dh wenn die meisten Schwerkraftberechnungen abgeschlossen sind. Für den Moment verwende ich einen XMLSerlaizer.Ausgabe von SVG Graph aus D3.js mit Phantomjs

Immer wenn ich die Seite von der Befehlszeile mit phantomjs aus führe, ist es fast so, als würde die Funktion, die die Graphzeichnung aufruft, nie benutzt. Ich dachte, das könnte wegen einer fehlenden page.onConsoleMessage sein, die ich hinzugefügt habe, aber immer noch die einzige Ausgabe ich bekomme die Konsolenmeldungen außerhalb der Funktion, die ich evaluieren möchte.

var page = require('webpage').create(); 
page.content = '<html><body></body></html>'; 

console.log("before"); 

page.includeJs('https://d3js.org/d3.v3.min.js', function() { 


    page.onConsoleMessage = function(msg) { 
     console.log("Message:" + msg); 
    }; 


    console.log("p"); 

    var html = page.evaluate(function() { 
     var body = d3.select('body'); 

     var data = { 
       "nodes":[ 
         {"name":"Steve"}, 
         {"name":"Dave"}, 
         {"name":"Matt"}, 
         ], 
       "links": 
         [{"source":0, "target":1}, 
         {"source":1, "target":2}, 
         {"source":2, "target":0} 
         ] 
        } 


     var force = d3.layout.force() 
       .charge(-140) 
       .linkDistance(2) 
       .size([500, 500]) 
       .nodes(data.nodes) 
       .links(data.links) 
       .start(); 

     var svg = body. 
       .append('svg') 
       .attr("width", 500) 
       .attr("height", 500) 
       .attr("id", "svg"); 
     ... 
     ...Graph drawing code 
     ... 


     var s = new XMLSerializer(); 
     return s.serializeToString(document.querySelector('svg')); 
    }); 
console.log(html); 
console.log(page.content); 
phantom.exit(); //Never gets called, "after" is printed 
}); 

console.log("after"); 
phantom.exit(); 

Also meine Frage ist, wie kann ich laufen und geben die Werte der Funktion Zeichnen von Graphen innerhalb page.includeJs...?

Vielen Dank, dass Sie sich die Zeit genommen haben, meine Frage zu lesen.

EDIT

Wenn ich die page.includeJs('https://d3js.org/d3.v3.min.js', function() {}); entfernen umliegenden erhalte ich Konsolnachrichten bis zu dem Punkt, wo diese javascript aufgenommen werden muss. Wie kann ich d3.js hinzufügen, ohne es auf diese Weise zu tun?

Antwort

1

Fixed durch Entfernen der umliegenden page.includeJs Block und ersetzt mit page.injectJs('d3.v3.min.js');