3 <title>citirani pie</title>
4 <script type="text/javascript" src="vis.stanford.edu/protovis/protovis.js"></script>
5 <script type="text/javascript" src="data.cgi"></script>
6 <style type="text/css">
7 body { max-width: 7in; }
12 <a href="http://vis.stanford.edu/protovis/api/">Protovis</a>
14 <script type="text/javascript+protovis">
16 //var data = [ 282, 189, 174, 163, 152, 140, 138, 130, 117, 116, 116, 94, 76, 44, 38 ];
21 var vis = new pv.Panel()
27 return Math.sqrt(d[0]) * 10;
31 return Math.sqrt(d[2]) * 10;
34 var pie = vis.add(pv.Wedge)
38 .outerRadius(function(d) radius(d))
39 .angle(function() 2 * Math.PI / data.length)
40 .strokeStyle("white").lineWidth(1)
43 var pie_ca = vis.add(pv.Wedge)
47 .outerRadius(function(d) r_ca(d))
48 .angle(function() 2 * Math.PI / data.length)
49 .strokeStyle("white").lineWidth(1)
55 .left( function(d) (radius(d) - 10 ) * Math.cos(pie.midAngle()) + width / 2)
56 .bottom(function(d) -(radius(d) - 10 ) * Math.sin(pie.midAngle()) + height / 2)
57 .textAlign("center").textBaseline("middle")
58 .text(function(d) d[0] )
64 .left( function(d) (radius(d) + 5 ) * Math.cos(pie.midAngle()) + width / 2)
65 .bottom(function(d) -(radius(d) + 5 ) * Math.sin(pie.midAngle()) + height / 2)
66 .textAlign("center").textBaseline("middle")
67 .font(function(d) Math.sqrt(d[0]) + "px sans-serif")
68 .text(function(d) d[1] )
74 .left( function(d) (r_ca(d) - 10) * Math.cos(pie.midAngle()) + width / 2)
75 .bottom(function(d) -(r_ca(d) - 10) * Math.sin(pie.midAngle()) + height / 2)
76 .textAlign("center").textBaseline("middle")
77 .text(function(d) d[2] )
86 .top(function(d) this.index * 25)
87 .width(function(d) d[0])
89 .anchor("right").add(pv.Label)
91 .text(function(d) d[0])
97 .top(function(d) this.index * 25 + 10)
98 .width(function(d) d[2])
100 .anchor("right").add(pv.Label)
102 .text(function(d) d[2])