block by lelandlee bae22800e5a50638cf64

Art - Stacked Donut Lines

Full Screen

#Art Maybe? To create this ‘visualisation’ I started with a donut chart, where that outerRadius’s would not be consistant. Meaning that they had different values as seen in the foreground. From there, using the angle of the bar relative to the x-axis and the length of the outer radius, I calculated the x and y coordinates of bar’s end. Then with some more math, the x1,x2, y1, and y2 of the individual lines.

The purpose is to be a stacked donut chart, without having to explicitly having multiple paths, instead the chart draws a line whenever there is a break in the data. ActionListeners are added on ‘mouseover’ and ‘mouseout’. Each line of the ray is uniquely tagged so that when a ray is selected all the lines on it are highlighted.

###Next Steps:

index.html

main_donut.js

style.css