p7
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title></title> | |
| <meta charset="utf-8"> | |
| <script src="http://d3js.org/d3.v3.min.js"></script> | |
| </head> | |
| <body> | |
| <script> | |
| var width = 900; | |
| var height = 900; | |
| var range = d3.range(500); | |
| var TWO_PI = 2 * Math.PI; | |
| var colorCount = 500; | |
| var translate = 'translate(' + (width / 2) + ',' + (height / 2) + ')'; | |
| var svg = d3.select("body") | |
| .append("svg:svg") | |
| .attr("width", width) | |
| .attr("height", height); | |
| svg.append("svg:path"); | |
| var path = svg.selectAll('path'); | |
| // power scale | |
| var color = d3.scale | |
| .pow() | |
| .exponent(.5) | |
| .domain([0, colorCount / 4, colorCount / 2, colorCount / 2 + colorCount / 4, colorCount]) | |
| .range(['#490A3D', '#BD1550', '#E97F02', '#F8CA00', '#8A9B0F']); | |
| d3.timer(function(time) { | |
| var vertices = updateData(time); | |
| path = path.data(d3.geom.voronoi(vertices).map(function(d) { | |
| return "M" + d.join("L") + "Z"; | |
| }), String); | |
| path.exit().remove(); | |
| path.enter().append("path").attr("fill", selectColor).attr("d", String) | |
| .attr('transform', translate); | |
| path.order(); | |
| }); | |
| function selectColor(d, i) { | |
| var j = i % (2 * colorCount); | |
| if (j > colorCount) { | |
| j = 2 * colorCount - j; | |
| } | |
| return color(j); | |
| } | |
| function updateData(time) { | |
| var time1 = TWO_PI / 30000 * (time % 1000000); | |
| var minorR = 40 ; | |
| var diff = 200 - minorR+time1; | |
| var s = diff / minorR; | |
| var theta = 0; | |
| var angleMultiplier = 200 - time1; | |
| var radiusEffect = time1 + minorR; | |
| return range.map(function() { | |
| theta += Math.sin(Math.PI * 4 /5000)*time1/100; | |
| var mult = angleMultiplier * theta; | |
| return [ | |
| diff * Math.sin(mult) + radiusEffect * Math.sin(mult * s), | |
| diff * Math.cos(mult) - radiusEffect * Math.cos(mult * s) | |
| ]; | |
| }); | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment