[英]Uncaught TypeError: d3.pack(...).sort is not a function
我是 Javascript 和 D3.js 的新手,我目前正在嘗試使用此處提供的示例在 d3.js 中構建氣泡圖https://jrue.github.io/coding/2014/exercises/basicbubblepackchart/並根據修改它到我的任務。 我知道上面的例子是用以前版本的 d3 編寫的,我使用的是 v4 版本,其中語法略有變化,但是在運行程序時出現以下錯誤:
未捕獲的類型錯誤:d3.pack(...).sort 不是函數
var diameter = 500, //max size of the bubbles
color = d3.scaleOrdinal(d3.schemeCategory10); //color category
var bubble = d3.pack()
.sort()
.size([diameter, diameter])
.padding(1.5);
var svg = d3.select("body")
.append("svg")
.attr("width", diameter)
.attr("height", diameter)
.attr("class", "bubble");
d3.csv("teams.csv", function(error, data){
data = data.map(function(d){ d.value = +d["Amount"]; return d; });
var nodes = bubble.nodes({children:data}).filter(function(d) { return !d.children; });
//setup the chart
var bubbles = svg.append("g")
.attr("transform", "translate(0,0)")
.selectAll(".bubble")
.data(nodes)
.enter();
bubbles.append("circle")
.attr("r", function(d){ return d.r; })
.attr("cx", function(d){ return d.x; })
.attr("cy", function(d){ return d.y; })
.style("fill", function(d) { return color(d.value); });
bubbles.append("text")
.attr("x", function(d){ return d.x; })
.attr("y", function(d){ return d.y + 5; })
.attr("text-anchor", "middle")
.text(function(d){ return d["Team"]; })
.style({
"fill":"black",
"font-family":"Helvetica Neue, Helvetica, Arial, san-serif",
"font-size": "12px"
});
這里有什么問題?
請務必使用與示例中的作者相同版本的 d3(看起來您對語法很好)。 此外,它是 'd3.layout.pack().sort(null)' :)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.