d3 使用随机数据生成条形图

var dataset = d3.range().map(function(){

    return d3.round(d3.random.normal(,)(),);

})

// 返回 [27.2, 12.9, 12.2, 6.8, 9.4, 7.1, 17.5, 30, 16.6, 24.3, 19, 16.6, 5.8, 6.1, 5, 32.3, 6.4, 17.5, 5.1, 19, 15.5, 22.4, 30.4, 6.2, 15.8]

d3.range(25) 生成25个数字

d3.random.normal(15,8)() 生成期望是15方差是8的动态分布随机数

round(...,1) 保留一位小数

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>testD3--dataPower.html</title>

<script type="text/javascript" src="http://localhost:8080/spring/js/d3.js"></script>

<style type="text/css">

div.bar {

    display: inline-block;

    width: 20px;

    margin-right: 2px;

    background-color: teal;

}

</style>

</head>

<body>

<script type="text/javascript">

var dataset = [];

for (var i = ; i < ; i++) {

    var newNumber = Math.round(Math.random() * );  //随机生成0-30的整数

    dataset.push(newNumber);

}

d3.select("body").selectAll("div")

    .data(dataset)

    .enter()

    .append("div")

    .attr("class", "bar")

    .style("height", function(d) {

        return (d * ) + "px";

    });

</script>

</body>

</html>

根据随机生成的数据生成条形图