This repository has been archived by the owner on Jan 26, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcreateSphere.coffee
113 lines (89 loc) · 3.09 KB
/
createSphere.coffee
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
this.createPieChart = (containerSelector, percentValue, width, height, outerRadius) ->
# config
# w = 450
# h = 300
# r = 43
w=width
h=height
r=outerRadius
ir = 0
textOffset = 14
tweenDuration = 250
innerCircleRadius = r - 8
strokeWidth = 1
# data objects
#lines, valueLabels, nameLabels
pieData = []
oldPieData = []
filteredPieData = []
# pie helper
pie = d3.layout.pie().value (d) ->
d.value
# arc helper
arc = d3.svg.arc()
arc.startAngle (d) -> d.startAngle
arc.endAngle (d) -> d.endAngle
arc.innerRadius ir
arc.outerRadius innerCircleRadius - strokeWidth
# small arc helper
smallArc = d3.svg.arc()
smallArc.startAngle (d) -> d.startAngle
smallArc.endAngle (d) -> d.endAngle
smallArc.innerRadius ir
smallArc.outerRadius innerCircleRadius - strokeWidth * 2
vis = d3.select(containerSelector).append("svg:svg").attr("width", w).attr("height", h)
arcGroup = vis.append("svg:g")
.attr("class", "arc")
.attr("transform", "translate(" + (w/2) + "," + (h/2) + ")")
greenGradient = arcGroup.append("svg:linearGradient")
.attr("id", "greenGradient")
.attr("x1", "0%")
.attr("x2", "0%")
.attr("y1", "0%")
.attr("y2", "100%")
greenGradient.append("svg:stop")
.attr("offset", "0%")
#.attr("style", "stop-color:#84c917;stop-opacity:1")
.attr("stop-color", "#84c917")
#.attr("stop-opacity", "1")
greenGradient.append("svg:stop")
.attr("offset", "100%")
#.attr("style", "stop-color:#6fa817;stop-opacity:1")
.attr("stop-color", "#6fa817")
#.attr("stop-opacity", "1")
reliefGradient = arcGroup.append("svg:linearGradient")
.attr("id", "reliefGradient")
.attr("x1", "0%")
.attr("x2", "0%")
.attr("y1", "0%")
.attr("y2", "100%")
reliefGradient.append("svg:stop")
.attr("offset", "0%")
.attr("style", "stop-color:#9bd343;stop-opacity:1")
reliefGradient.append("svg:stop")
.attr("offset", "100%")
.attr("style", "stop-color:#9bd343;stop-opacity:0")
labelGroup = vis.append("svg:g")
.attr("class", "labelGroup")
.attr("transform", "translate(" + (w/2) + "," + (h/2) + ")")
centerGroup = vis.append("svg:g")
.attr("class", "centerGroup")
.attr("transform", "translate(" + (w/2) + "," + (h/2) + ")")
outerCircle = arcGroup.append("svg:circle")
.attr("fill", "#eaebeb")
.attr("r", r)
innerCircle = arcGroup.append("svg:circle")
.attr("fill", "#ced3d7")
.attr("r", innerCircleRadius)
endRadians = percentValue*3.6/180*Math.PI
arcGroup.append("svg:path")
.attr("fill", "url(#greenGradient)")
#.attr("fill", "rgba(255,255,255,1)")
.attr("stroke", "#72ad16")
.attr("d", arc({startAngle: 0, endAngle: endRadians}))
arcGroup.append("svg:path")
#.attr("fill", "rgba(0,0,0,0)")
.attr("fill", "rgba(255,0,255,0)")
# .attr("fill-opacity", "0")
.attr("stroke", "url(#reliefGradient)")
.attr("d", smallArc({startAngle: 0, endAngle: endRadians}))