git.roojs.org Git - g.raphael/blob - g.pie.sector.js

   1 /*
   2  * g.Raphael 0.5 - Charting library, based on Raphaël
   3  *
   4  * Copyright (c) 2009 Dmitry Baranovskiy (http://g.raphaeljs.com)
   5  * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
   6  */
   7 Raphael = typeof(Raphael) != 'undefined' ? Raphael :  (imports ? imports.seed.Raphael.Raphael : {});
   8 Roo = typeof(Roo) != 'undefined' ? Roo:  (imports ? imports.seed.Roo.Roo: {});
   9 //chartinst = typeof(chartinst) != 'undefined' ? chartinst:  (imports ? imports.chartinst.chartinst : {});
  10
  11
  12
  13 (function () {
  14
  15     /**
  16      * @param {Raphael} paper to draw on
  17      * @param {int} cx - centre X
  18      * @param {int} cy - centre Y
  19      * @param {int} r - radius
  20      * @param {Array} values
  21      * @param {Object} opts options
  22      *   cut : after this meany items - do not show a pie element?
  23      *
  24      *
  25      *
  26      */
  27
  28     function Piesectorchart(paper, width, height, cx, cy, r, values, opts) {
  29
  30         opts = opts || {};
  31
  32         var chartinst = this,
  33             chart = paper.set(),
  34             len = values.length,
  35             angle = opts.start_angle || 90,
  36             total = 0,
  37             others = 0,
  38             cut = opts.cut || 9,
  39             defcut = true;
  40
  41         opts.barwidth = opts.barwidth || 80;
  42
  43         paper.rect(0, 0, width, height).attr({ stroke: "none", fill: (opts.background || "#F0F4F7") });
  44
  45         paper.customAttributes.sector = function (cx, cy, startAngle, endAngle, color, R) {
  46
  47             var rad = Math.PI / 180,
  48                 x1 = cx + r * Math.cos(-startAngle * rad),
  49                 x2 = cx + r * Math.cos(-endAngle * rad),
  50                 y1 = cy + r * Math.sin(-startAngle * rad),
  51                 y2 = cy + r * Math.sin(-endAngle * rad),
  52                 path;
  53
  54             path = [["M", x1, y1], ["A", R, R, 0, +(Math.abs(endAngle - startAngle) > 180), 1, x2, y2]];
  55
  56             return {path: path, stroke: color};
  57         };
  58
  59         if (len == 1) {
  60             total = values[0];
  61             paper.circle(cx, cy, r + opts.barwidth / 2).attr({ fill: opts.colors && opts.colors[0] || chartinst.colors[0] || "#3E66BC" });
  62             paper.circle(cx, cy, r - opts.barwidth / 2).attr({ fill: opts.background || "#F0F4F7" });
  63
  64         } else {
  65
  66             for (var i = 0; i < len; i++) {
  67                 total += values[i] * 1;
  68                 values[i] = {
  69                     value: values[i],
  70                     valueOf: function () { return this.value; }
  71                 };
  72             }
  73
  74             if (!opts.no_sort) {
  75                 values.sort(function (a, b) {
  76                     return b.value - a.value;
  77                 });
  78             }
  79
  80             for (i = 0; i < len; i++) {
  81                 if (defcut && values[i] * 360 / total <= 1.5) {
  82                     cut = i;
  83                     defcut = false;
  84                 }
  85
  86                 if (i > cut) {
  87                     defcut = false;
  88                     values[cut].value += values[i];
  89                     values[cut].others = true;
  90                 }
  91             }
  92
  93             len = Math.min(cut + 1, values.length);
  94
  95             for (i = 0; i < len; i++) {
  96
  97                 var p = paper.path().attr({
  98                     "stroke": "#fff",
  99                     "stroke-width": opts.barwidth
 100                 }).attr({sector: [cx, cy, angle, angle -= 360 * values[i] / total, opts.colors && opts.colors[i] || chartinst.colors[i], r]});
 101
 102             }
 103
 104         }
 105
 106         var ix = cx + r + opts.barwidth / 2 + 30,
 107             iy = cy - r - 30;
 108
 109         for (var i = 0; i < len; i++) {
 110
 111             paper.circle(ix, iy, 6).attr({ fill: opts.colors && opts.colors[i] || chartinst.colors[i] || "#3E66BC" });
 112
 113             var text = (values[i].others) ? opts.others : opts.legend[i] || values[i];
 114
 115             if(text.indexOf('#%#') !== -1) {
 116                 text = text.replace('#%#', Math.round(values[i] / total * 100) + '%');
 117             }
 118
 119             paper.text(ix + 20, iy, text).attr({
 120                 "font-size": "18",
 121                 "font-family": "'Fontin Sans', Fontin-Sans, sans-serif",
 122                 "text-anchor": "start",
 123                 fill : "#0C014F"
 124             });
 125
 126             iy += 30;
 127
 128         }
 129
 130         chart.cx = cx;
 131         chart.cy = cy;
 132         chart.r = r;
 133         return chart;
 134     };
 135
 136     //inheritance
 137     var F = function() {};
 138     F.prototype = Raphael.g;
 139     Piesectorchart.prototype = new F;
 140
 141     //public
 142     Raphael.fn.piesectorchart = function(width, height, cx, cy, r, values, opts) {
 143         return new Piesectorchart(this, width, height, cx, cy, r, values, opts);
 144     }
 145
 146 })();