d3 使用數據
阿新 • • 發佈:2017-05-22
span title test cnblogs spring func 數組 clas spa
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>testD3-3.html</title> <script type="text/javascript" src="http://localhost:8080/spring/js/d3.js"></script> </head> <body> <script type="text/javascript"> var dataset = [ 5, 10, 15, 20, 25 ]; d3.select("body").selectAll("p") .data(dataset) .enter() .append("p") .text(function(d) { return "I can count up to " + d; }) .style("color", function(d) { if (d > 15) { //大於15的數字顯示為紅色 return"red"; } else { return "black"; } }); </script> </body> </html>
.text(function(d){}), 在回調函數當中傳入的數據分別對應數組當中的數據,
.style(), 同上,在回調函數當中傳入對應的數據,根據數據返回字體的顏色
d3 使用數據