如何從Python生成D3.js圓形樹狀圖代碼

enter image description here

基於代碼here：

<!DOCTYPE html> 
<meta charset="utf-8"> 
<title>Flare Dendrogram</title> 
<style> 

.node circle { 
    fill: #fff; 
    stroke: steelblue; 
    stroke-width: 1.5px; 
} 

.node { 
    font: 10px sans-serif; 
} 

.link { 
    fill: none; 
    stroke: #ccc; 
    stroke-width: 1.5px; 
} 

</style> 
<body> 
<script src="http://d3js.org/d3.v3.min.js"></script> 
<script> 

var radius = 960/2; 

var cluster = d3.layout.cluster() 
    .size([360, radius - 120]); 

var diagonal = d3.svg.diagonal.radial() 
    .projection(function(d) { return [d.y, d.x/180 * Math.PI]; }); 

var svg = d3.select("body").append("svg") 
    .attr("width", radius * 2) 
    .attr("height", radius * 2) 
    .append("g") 
    .attr("transform", "translate(" + radius + "," + radius + ")"); 

d3.json("/d/4063550/flare.json", function(error, root) { 
    var nodes = cluster.nodes(root); 

    var link = svg.selectAll("path.link") 
     .data(cluster.links(nodes)) 
    .enter().append("path") 
     .attr("class", "link") 
     .attr("d", diagonal); 

    var node = svg.selectAll("g.node") 
     .data(nodes) 
    .enter().append("g") 
     .attr("class", "node") 
     .attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; }) 

    node.append("circle") 
     .attr("r", 4.5); 

    node.append("text") 
     .attr("dy", ".31em") 
     .attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; }) 
     .attr("transform", function(d) { return d.x < 180 ? "translate(8)" : "rotate(180)translate(-8)"; }) 
     .text(function(d) { return d.name; }); 
}); 

d3.select(self.frameElement).style("height", radius * 2 + "px"); 

</script>

有沒有一種方法，我可以使用Python產生上述確切的數字（HTML）？

來源

2014-03-29 neversaint

當然還有一個辦法 - 你只需要重新編寫d3.js圖書館和蟒蛇DOM的所有相關部分 - 但是這可能不是你想聽到的。你能更清楚地解釋*爲什麼*你想使用python而不是Javascript？也許有另一種方法可以在不重新發明輪子的情況下滿足你的目標。 – AmeliaBR

假設您想要避免必須編寫JavaScript並使用python代替，您可以查看一下pyjs。從他們website：

pyjs contains a Python-to-JavaScript compiler, an AJAX framework and a 
Widget Set API. pyjs started life as a Python port of Google Web Toolkit, 
the Java-to-JavaScript compiler.

我還沒有使用它，我不能確定你將如何去包括D3庫。但他們的wiki有以下頁面：

https://github.com/pyjs/pyjs/wiki/Calling-a-jQuery-component-from-Pyjs

這篇文章可能會給你是否pyjs是對你有用的想法。

來源

2014-07-05 06:42:07 pandita

有沒有一種方法可以使用Python來生成上面的確切數字（HTML）？

與pandita's suggestion不太相似，您可以使用Brython，它允許您在Web瀏覽器中運行Python。一些示例框架代碼（使用D3.js;我不知道給你D3.js.好一個樹狀圖產生的任何Python庫）：

<!DOCTYPE html> 
<meta charset="utf-8"> 
<title>Flare Dendrogram</title> 
<style> 
/* CSS goes here */ 
</style> 

<script src="http://d3js.org/d3.v3.min.js"></script> 
<script src="brython.js"></script> 
<script type="text/python"> 
# 
# Python code to generate dendogram here 
# (equivalent to the sample JavaScript code provided) 
# 
</script> 


<body onload="brython()"> 
</body> 
</html>

但是這似乎並不像一個偉大的解。

您也可能會發現這個StackOverflow的頁面有所幫助：How do I create a radial cluster like the following code-example in Python?

來源

2014-07-10 04:51:21 stellarchariot

如何從Python生成D3.js圓形樹狀圖代碼

回答

相關問題