d3.js学习笔记（二） 柱形图

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>    
<script>    
        var width = 600;  
        var height = 600;  
        var svg = d3.select("body").append("svg")  
                       .attr("width",width)  
                       .attr("height",height);  
          
        var dataset = [ 30 , 20 , 45 , 12 , 21 ];  
        var wx = d3.scale.linear

  <span style="white-space:pre">		</span>.domain([0,d3.max(dataset)])

<span style="white-space:pre">		</span>.range([0,500]);
        svg.selectAll("rect")  
           .data(dataset)  
           .enter()  
           .append("rect")  
           .attr("x",10)  
           .attr("y",function(d,i){  
                return i * 30;  
           })  
           .attr("width",wx)  
           .attr("height",28)  
           .attr("fill","red");  
             
</script> 

 enter 表示当所需要的元素（这里为 rect ）比绑定的数据集合的元素（这里为 dataset ）少时，自动添加位置，使得与数据集合的数量一样多。