fix #7848 - tracking graphs
authorAlan <alan@roojs.com>
Fri, 1 Dec 2023 05:22:08 +0000 (13:22 +0800)
committerAlan <alan@roojs.com>
Fri, 1 Dec 2023 05:22:08 +0000 (13:22 +0800)
test/bartest.html

index 0b98eef..7edfaec 100644 (file)
@@ -10,6 +10,7 @@
         <script src="../raphael-min.js" type="text/javascript" charset="utf-8"></script>
         <script src="../g.raphael.js" type="text/javascript"></script>
         <script src="../g.bar.horizontal.js" type="text/javascript" charset="utf-8"></script>
+        <script src="../g.bar.vertical.js" type="text/javascript" charset="utf-8"></script>
         <script src="../g.bar.overlay.js" type="text/javascript" charset="utf-8"></script>
         <script src="../g.pie.sector.js" type="text/javascript" charset="utf-8"></script>
         <script type="text/javascript" charset="utf-8">
@@ -19,7 +20,7 @@
          <script type="text/javascript" charset="utf-8">
 ;
             window.onload = function () {
-                var r = new Raphael("holder",550,450);
+                var r = new Raphael("holder",400,500);
 
                 // r.mhbarchart(1300, 600, [31,10,5,4,4,4,4,4,4,4], {
                 //     colors : ["#FF36C5","#FF36C5","#FF36C5","#FF36C5","#FF36C5","#FF36C5","#FF36C5","#FF36C5","#FF36C5","#FF36C5"],
                 // console.log(r);
 
 
-        r.piesectorchart(400, 450, 200, 150, 105, [133,2,64,125,21,1024,37,1,5], {
-            background: '#FFFFFF',
-            barwidth : 70,
-            colors:  ["#83DBFF","#F9C80A","#1E47DA","#B21ADF","#FF11BA","#FF8C30"],
-            cut: 5,
-            others: 'Others - #qty# (#%#)',
-            labels: ["#%#","#%#","#%#","#%#","#%#","#%#","#%#","#%#","#%#"],
-            labelfont: 'Work Sans',
-            labelsize: 20,
-            labelweight: 600,
-            legend:  ["Germany - #qty# (#%#)","Austria - #qty# (#%#)","United Kingdom - #qty# (#%#)","France - #qty# (#%#)","Italy - #qty# (#%#)","Spain - #qty# (#%#)","Belgium - #qty# (#%#)","Sweden - #qty# (#%#)","Europe - #qty# (#%#)"],
-            legendpos: 'bottom',
-            legendkeyshape: 'rect',
-            legendkeysize: 14,
-            legendfont: 'Work Sans',
-            legendfontsize: 14,
-            legendfontcolor: '#323232',
-            lineheight: 23,
-            legendcolumn: 1
-        });
-                        
-                     
-            };
+                // r.piesectorchart(400, 450, 200, 150, 105, [133,2,64,125,21,1024,37,1,5], {
+                //     background: '#FFFFFF',
+                //     barwidth : 70,
+                //     colors:  ["#83DBFF","#F9C80A","#1E47DA","#B21ADF","#FF11BA","#FF8C30"],
+                //     cut: 5,
+                //     others: 'Others - #qty# (#%#)',
+                //     labels: ["#%#","#%#","#%#","#%#","#%#","#%#","#%#","#%#","#%#"],
+                //     labelfont: 'Work Sans',
+                //     labelsize: 20,
+                //     labelweight: 600,
+                //     legend:  ["Germany - #qty# (#%#)","Austria - #qty# (#%#)","United Kingdom - #qty# (#%#)","France - #qty# (#%#)","Italy - #qty# (#%#)","Spain - #qty# (#%#)","Belgium - #qty# (#%#)","Sweden - #qty# (#%#)","Europe - #qty# (#%#)"],
+                //     legendpos: 'bottom',
+                //     legendkeyshape: 'rect',
+                //     legendkeysize: 14,
+                //     legendfont: 'Work Sans',
+                //     legendfontsize: 14,
+                //     legendfontcolor: '#323232',
+                //     lineheight: 23,
+                //     legendcolumn: 1
+                // });
+
+                r.mvbarchart(400, 500, [7,6000,857,20], {
+                    colors : ["#E2BEFF","#BF70FF","#8329CA","#3F066C"],
+                    axis : '0 0 0 1',
+                    legend:  ["No. Releases - #qty#","Total Coverage - #qty#","Website: #qty#","Earned Media: #qty#"],
+                    leftaxisstep : 4
+                });
+            }
         </script>
     </head>
     <body class="raphael" id="g.raphael.dmitry.baranovskiy.com">
-        <div id="holder" style='width:1300px !important; height:600px!important'></div>
+        <div id="holder" style='width:2000px !important; height:1000px!important'></div>
         <p>
             Demo of <a href="http://g.raphaeljs.com/">gRaphaĆ«l</a> JavaScript library.
         </p>