File indexing completed on 2024-12-22 05:36:17 

0001 
0002 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
0003 
0004 <html xmlns="http://www.w3.org/1999/xhtml">
0005   <!--
0006     Modified from the Debian original for Ubuntu
0007     Last updated: 2014-03-19
0008     See: https://launchpad.net/bugs/1288690
0009   -->
0010   <head>
0011     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
0012     <title>D3</title>    
0013     <style type="text/css">
0014      body{
0015         font-family: sans-serif;
0016         font-size: 12px;
0017      }
0018     </style>
0019  </head>
0020   <body>
0021 <div style="width: 65%">
0022     <div style="display: block; float: right; width: 300px" id="detailContainer">
0023 
0024     </div>
0025     <div>
0026     <div id="pie" style="padding:50px; "></div>
0027 
0028     <div id="pie2" style="padding:50px;"></div>
0029 
0030     <div id="pie3" style="padding:50px; "></div>
0031     </div>
0032 </div>
0033 <script src="//d3js.org/d3.v4.min.js"></script>
0034 <script src="theme/flatui/js/lib/d3pie.min.js"></script>
0035 <script>
0036 
0037   d3.csv("data/payout_201707.csv",function(d) {
0038    return {
0039       label:d.MemberId+'['+d.Amount+']',
0040       value: +d.Amount,
0041       member:d.MemberId
0042    }
0043 }, function(data) {
0044       
0045       var pie = new d3pie("pie", {
0046           size: {
0047             canvasWidth: 590,
0048             pieOuterRadius: "90%"           
0049           },
0050           header: {
0051               title: {
0052                 text: "Member payout_201707",
0053                 fontSize: 24,
0054                 font: "open sans"
0055                 }
0056             },
0057           data: {
0058             sortOrder: "value-desc",
0059             smallSegmentGrouping: {
0060               enabled: true,
0061               value: 1,
0062               valueType: "percentage",
0063               label: "<2%"
0064             },
0065             content: data
0066           },
0067         callbacks: {
0068             onClickSegment: function(a) {
0069               if(!a.data.isGrouped)
0070               {
0071                   var url='https://opendesktop.org/member/'+a.data.member;
0072                   window.open(url,'_blank');
0073               }else{
0074                   console.log(a);
0075                   d3.select('#detailContainer').html('');
0076 
0077                   var dh='<table>';
0078                    var da = a.data.groupedData;                   
0079                    dh=dh+'<tr><td>#'+da.length+'</td><td>'+a.data.value+'</td></tr>';
0080                    da.forEach(function(d, i) {
0081                         dh=dh+'<tr><td><a target="_blank" href="https://opendesktop.org/member/'+d.member+'">'+d.member+'</a></td><td>'+d.value+'</td></tr>';                      
0082                     });
0083                    dh=dh+'</table>';
0084                   d3.select('#detailContainer').html(dh);
0085               }              
0086             }
0087           }
0088         });
0089 
0090   });
0091 
0092   d3.csv("data/payout_201706.csv",function(d) {
0093      return {
0094         label:d.MemberId+'['+d.Amount+']',
0095         value: +d.Amount,
0096         member:d.MemberId
0097      }
0098   }, function(data) {
0099         
0100         var pie = new d3pie("pie2", {
0101             size: {
0102               canvasWidth: 590,
0103               pieOuterRadius: "90%"           
0104             },
0105             header: {
0106                 title: {
0107                   text: "Member payout_201706",
0108                   fontSize: 24,
0109                   font: "open sans"
0110                   }
0111               },
0112             data: {
0113               sortOrder: "value-desc",
0114               smallSegmentGrouping: {
0115                 enabled: true,
0116                 value: 1,
0117                 valueType: "percentage",
0118                 label: "<2%"
0119               },
0120               content: data
0121             },
0122           callbacks: {
0123               onClickSegment: function(a) {
0124                 if(!a.data.isGrouped)
0125                 {
0126                     var url='https://opendesktop.org/member/'+a.data.member;
0127                     window.open(url,'_blank');
0128                 }else{
0129                     console.log(a);
0130                     d3.select('#detailContainer').html('');
0131 
0132                     var dh='<table>';
0133                      var da = a.data.groupedData;                   
0134                      dh=dh+'<tr><td>#'+da.length+'</td><td>'+a.data.value+'</td></tr>';
0135                      da.forEach(function(d, i) {
0136                           dh=dh+'<tr><td><a target="_blank" href="https://opendesktop.org/member/'+d.member+'">'+d.member+'</a></td><td>'+d.value+'</td></tr>';                      
0137                       });
0138                      dh=dh+'</table>';
0139                     d3.select('#detailContainer').html(dh);
0140                 }              
0141               }
0142             }
0143           });
0144 
0145     });
0146 
0147   d3.csv("data/payout_201705.csv",function(d) {
0148      return {
0149         label:d.MemberId+'['+d.Amount+']',
0150         value: +d.Amount,
0151         member:d.MemberId
0152      }
0153   }, function(data) {
0154         
0155         var pie = new d3pie("pie3", {
0156             size: {
0157               canvasWidth: 590,
0158               pieOuterRadius: "90%"           
0159             },
0160             header: {
0161                 title: {
0162                   text: "Member payout_201705",
0163                   fontSize: 24,
0164                   font: "open sans"
0165                   }
0166               },
0167             data: {
0168               sortOrder: "value-desc",
0169               smallSegmentGrouping: {
0170                 enabled: true,
0171                 value: 1,
0172                 valueType: "percentage",
0173                 label: "<2%"
0174               },
0175               content: data
0176             },
0177           callbacks: {
0178               onClickSegment: function(a) {
0179                 if(!a.data.isGrouped)
0180                 {
0181                     var url='https://opendesktop.org/member/'+a.data.member;
0182                     window.open(url,'_blank');
0183                 }else{
0184                     console.log(a);
0185                     d3.select('#detailContainer').html('');
0186 
0187                     var dh='<table>';
0188                      var da = a.data.groupedData;                   
0189                      dh=dh+'<tr><td>#'+da.length+'</td><td>'+a.data.value+'</td></tr>';
0190                      da.forEach(function(d, i) {
0191                           dh=dh+'<tr><td><a target="_blank" href="https://opendesktop.org/member/'+d.member+'">'+d.member+'</a></td><td>'+d.value+'</td></tr>';                      
0192                       });
0193                      dh=dh+'</table>';
0194                     d3.select('#detailContainer').html(dh);
0195                 }              
0196               }
0197             }
0198           });
0199 
0200     });
0201 </script>
0202   </body>
0203 </html>