From aca5d637a9b95ccaa430d6830322badf1f41b1b2 Mon Sep 17 00:00:00 2001
From: Dobrica Pavlinusic <dpavlin@rot13.org>
Date: Fri, 10 Jul 2009 13:52:57 +0000
Subject: [PATCH] added barchart to protovis

git-svn-id: svn+ssh://mjesec/home/dpavlin/svn/webpac2/trunk@1233 07558da8-63fa-0310-ba24-9fe276d99e06
---
 vhost/dipl/data.cgi |  2 +-
 vhost/dipl/pie.html | 64 ++++++++++++++++++++++++++++++++++++++++-----
 2 files changed, 58 insertions(+), 8 deletions(-)

diff --git a/vhost/dipl/data.cgi b/vhost/dipl/data.cgi
index c7e3c70..08d8cdd 100755
--- a/vhost/dipl/data.cgi
+++ b/vhost/dipl/data.cgi
@@ -11,7 +11,7 @@ print "Content-type: text/javascript\n\r\n\r";
 my $dbh = DBI->connect('dbi:Pg:dbname=dipl','dpavlin','', { RaiseError => 1, AutoCommit => 0 });
 
 my $data = $dbh->selectall_arrayref(q{
-	select sum(ttc),ca from citirani group by ca order by sum desc ;
+	select sum(ttc),ca,count(ca) from citirani group by ca order by count asc ;
 });
 print "var data = ",to_json(
 #	 [ map { $_->[0] } @$data ] 
diff --git a/vhost/dipl/pie.html b/vhost/dipl/pie.html
index ca3d32c..9d58a17 100644
--- a/vhost/dipl/pie.html
+++ b/vhost/dipl/pie.html
@@ -15,8 +15,8 @@
 
 //var data = [ 282, 189, 174, 163, 152, 140, 138, 130, 117, 116, 116, 94, 76, 44, 38 ];
 
-var width  = 600;
-var height = 400;
+var width  = 800;
+var height = 600;
 
 var vis = new pv.Panel()
 	.width(width)
@@ -27,31 +27,81 @@ function radius(d) {
 	return Math.sqrt(d[0]) * 10;
 }
 
+function r_ca(d) {
+	return Math.sqrt(d[2]) * 10;
+}
+
 var pie = vis.add(pv.Wedge)
 	.data(data)
 	.left( width / 2 )
 	.bottom( height / 2 )
 	.outerRadius(function(d) radius(d))
 	.angle(function() 2 * Math.PI / data.length)
+	.strokeStyle("white").lineWidth(1)
+	;
+
+var pie_ca = vis.add(pv.Wedge)
+	.data(data)
+	.left( width / 2 )
+	.bottom( height / 2 )
+	.outerRadius(function(d) r_ca(d))
+	.angle(function() 2 * Math.PI / data.length)
+	.strokeStyle("white").lineWidth(1)
 	;
 
 // ca
 vis.add(pv.Label)
 	.data(data)
-	.left(  function(d)  radius(d) * Math.cos(pie.midAngle()) + width  / 2)
-	.bottom(function(d) -radius(d) * Math.sin(pie.midAngle()) + height / 2)
+	.left(  function(d)  (radius(d) - 10 ) * Math.cos(pie.midAngle()) + width  / 2)
+	.bottom(function(d) -(radius(d) - 10 ) * Math.sin(pie.midAngle()) + height / 2)
 	.textAlign("center").textBaseline("middle")
+	.text(function(d) d[0] )
+	.textStyle("white")
+	;
+
+vis.add(pv.Label)
+	.data(data)
+	.left(  function(d)  (radius(d) + 5 ) * Math.cos(pie.midAngle()) + width  / 2)
+	.bottom(function(d) -(radius(d) + 5 ) * Math.sin(pie.midAngle()) + height / 2)
+	.textAlign("center").textBaseline("middle")
+	.font(function(d) Math.sqrt(d[0]) + "px sans-serif")
 	.text(function(d) d[1] )
 	;
 
 // ttc
 vis.add(pv.Label)
 	.data(data)
-	.left(  function()  50 * Math.cos(pie.midAngle()) + width  / 2)
-	.bottom(function() -50 * Math.sin(pie.midAngle()) + height / 2)
+	.left(  function(d)  (r_ca(d) - 10) * Math.cos(pie.midAngle()) + width  / 2)
+	.bottom(function(d) -(r_ca(d) - 10) * Math.sin(pie.midAngle()) + height / 2)
 	.textAlign("center").textBaseline("middle")
-	.text(function(d) d[0] )
+	.text(function(d) d[2] )
+	.textStyle("white")
 	;
+
+// bar charts
+
+vis.add(pv.Bar)
+	.data(data)
+	.left(0)
+	.top(function(d) this.index * 25)
+	.width(function(d) d[0])
+	.height(10)
+.anchor("right").add(pv.Label)
+	.textAlign("left")
+	.text(function(d) d[0])
+	;
+
+vis.add(pv.Bar)
+	.data(data)
+	.left(0)
+	.top(function(d) this.index * 25 + 10)
+	.width(function(d) d[2])
+	.height(10)
+.anchor("right").add(pv.Label)
+	.textAlign("left")
+	.text(function(d) d[2])
+	;
+
 vis.root.render();
 </script>
 
-- 
2.20.1