Javascript 分组条形图

大家好，我正在尝试用d3js绘制一个分组条形图 我想通过几个教程，最后尝试使用以下代码：

<script>
var data = [[10,20,30,40,50],[20,20,40,50,60]];
var canvas = d3.select("body")
    .append("svg")
    .attr("width",500)
    .attr("height",500);
    canvas.selectAll("rect")
        .data(data)
        .enter()
        .append("rect")
        .attr("height",function(d){return d*10;})
        .attr("width",50)
        .attr("x",function(d,i){return i*60})
        .attr("y",function(d,i){return 500-(d*10);})
        .attr("fill","red");
</script>

var数据=[[10,20,30,40,50]，[20,20,40,50,60]；
var canvas=d3.选择（“主体”）
.append（“svg”）
.attr（“宽度”，500）
.attr（“高度”，500）；
canvas.selectAll（“rect”）
.数据（数据）
.输入（）
.append（“rect”）
.attr（“高度”，函数（d）{返回d*10；}）
.attr（“宽度”，50）
.attr（“x”，函数（d，i）{return i*60}）
.attr（“y”，函数（d，i）{return 500-（d*10）；}）
.attr（“填充”、“红色”）；

---

有一些错误。如何为分组图表设置数据。

要回答第一个问题，您使用的错误来自您选择的数据结构。由于

.data（data.enter（）

子句的工作方式，发生此错误

整个子句将隐式地迭代outter数组中第一级的元素。即传递给的每个元素

d

.attr（“height”，function（d）{…）.attr（“x”，function（d）…）和.attr（“y”，function（d）…）

是一个数组。因此，每个函数的内部都使用数组上的常量进行操作，这毫无意义。在javascript中澄清

d*[1,2,3,4]

的含义是什么

回答你的第二个问题。如果你想创建一个分组条形图，请查看以下链接：。

你看到了吗？定义“一些错误”，如果你不知道问题是什么，我们真的帮不了你多少忙。如果你能在JSFIDLE或类似服务中重现它，那就太好了。