- mugen Museum
- 16F D3 アート
- 出版の行方
出版の行方
作品を見る
http://etext-music.com/works/svg/D3_3_5.html
・全画面モード(F11)がおすすめ。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>出版の行方</title>
<script src="my.js"></script>
<script src="d3.js"></script>
<style>
@font-face {
font-family:Splendid ES; src:url(Splendid ES.ttf) format("truetype");
}
</style>
</head>
<body style="margin:0; background-color:black;">
<script>
svg=d3.select("body").append("svg").attr("width",1920-4).attr("height",1080-4)
svg.selectAll()
.data(d3.range(20))
.enter()
.append("text")
.text(function(){return RandomSelect("SVG","D3","ePub","HTML5","CSS3","dbookPRO")})
.attr("font-family","Splendid ES, cursive")
.each(loop)
function loop(){
var c=d3.select(this);
(function repeat(){
t=Random(2000,20000)
c=c
.transition().duration(t)
.attr("x",Random(1,1920))
.attr("y",Random(1,1080))
.attr("text-anchor","middle")
.attr("fill","rgb("+Random(255)+","+Random(255)+","+Random(255)+")")
.attr("font-size",Random(32,320)+"px")
.attr("opacity",Random(2,8)/10)
.each("end",repeat)
})();
}
</script>
</body>
</html>