RIFF"WEBPVP8 Е�* �>�T�M'��%�u|�� gk�ZaQb�����o����lN���s�_�3��S+���c�€R��y����//����~��H�@�2oF�X ���R@'�:�ꞓ}��a�M,.� ��o��=�p�U�&g<�:���~���t��.�1���cyW�� We�M=�f�Y6v�����(nO���������^- �9(b _�s%{�C|�p�@�����37�}B0��u���i�Գ���� ������5�}���֮M?dz���q�e��N�~�&�N��K�av$]hO�i�C�,��"]�����@����M@�o O[�Æ*;�e]��_; }�p�?��)�'VC� J��L�y� v����18��)7c�d�mߛ�]I� ����d��?�{�.����b)49��c��Zy/��c^��%��/z�å̯�t��rS��Z��Uͩ�h��2����` �7�:��~��zP���Z����?v�R��TD���G����CJ���}�o��fs��̜#b��e"k9,���3�{Or�i��x":���{/ۈ�`�7RČ����(�p:I��%:�ͺ��W(|�=KP��3�7}���������ed��;�3�;�e��8�g�4�9 %v,B�GU�����T% ֯��B+�tR���p������F7�sT��oϱq �h�Rݧ�~*�܈_�Ck���}�nY�>��C�PQ�B��(o�६�qxy������f ���]��}����%=CW�k^t�—]����M�cX�i��%��!�Y������:N=|��wj<9ł��,�s�O�,,�U�!�������e���{���W��989�y*z�=�"E�CyW���N�2�ę��LN�HW��?����`V���DJ=#׶×ܽ$eF���o;b� ��0��&�W���Y�bR�� �Fֵ� `J�an�-Є@�tR�v��e2W��Mn�p��4P1�q ���®w���ũur*�җ.�#�4b���������:���g��ʧ�`R�4�+G�f���niU����$�K-'A�zE&]��Y�H2�4� ��˄�t��Q�4%��L�#��0FS8�Bu����ژ��"����۹�[�JK��4��z�v�ڌ��L*jD0.����?�ڃN��H��J����n�w��6Q(i;��I,.3?|�`���y���D_��(��w��������[��ZYhe�')��D*��kb����c��@� �|S�S3���- ���iq!*��w������Ł��ܩ��*FY���jV�4Q���4�,�ʑV!��N�.�1�KT,��Zp� ���iL�r��Ȧ����"y�tU���PS�ģ��?�QGng_�#yEk��B̝��1hr��ѕ�z*Ԧ�L8T�����H�^�k�-�g�z������w��N����v��RH��E��!0Cؚ)R�@�q�J�qA�r�$k4���om���Ьnu���x�������������y$�8�Z���v� &�+2�|���\r:[,!�Y�C#c��͊�{��7Щ��Y�LVę]�j��)��^���󶦙$�_����Hx>����[ +K�ڏ�1������Q�7@�^{�ik�;'H{�8 �ȇe vR����^� Meq�����Y�MC��U<��O�۫�nAfBf317���x��O�.u@3R}e�`�D��\�z���L��P������y8�?����I�"s`�b 3��ٹd�0��A�/���� ��{b�b������1� ����ka�&T�z�_4���I��PN��8��}N�r��]�՜���ӿ��9�|/.��� �fˑ.�`r�r��U-���7�Rx8L��d$H�m��Ǒ�*x�P{�D�����k��o�ueV�-.��j}���U2��g絍g���s �������aN�X�ҍ���C�� ��X��B�EF���8%p57<�x�Y�e�cϔ�\��C �OAj&N�V���!v��U��~J��j��4�V|��8�R�v�fD�)�HA�3�G��ds�7Z.���= ����+kI2�0=�'� K �H,`�ɴāTE\����E�'/��;���;��a���0"��� �x$J�T��#U=������j-�8�����y c8W����Ԋ�K��_��Y� '%Vg$I�Пq�shE�y�:�m�}�F1(:b�U�~� ���0}�C�}0����#�#}���e�S9��.��SP�m���<�~�y��� ��ɭ�ٮ6N��� ğ��t��A��N�V ������f�+�w�O1�Jq���U�B�T��į���� ��*�=z�x"yU S���� ��// ����W᫮��R�O�2W�M��<-�;�F�`9 �����t�:C{a�8�� <�r'���:�g8%�9J̞�˦��eV�7l�~�#����.yY)$��k�|�!�3���m���XS���J4B���`�����oL[]��aT[�C��@h�T�l��_�e>�����K<'��P�zgk�#fm��V�]�ݽ�j1����H��J��J58��ڱ��@�e&*�w��e���Q��HT8�ֽ��\�Fa�栆�A�ڝӚ׹@�:9`��G�h�7����t<���_˒|�\bU�O�����,M�a�oynGf�޶7�w�i`�m[��XE4�*�8}5��U1���^�B*��_%[����Yb�^���S�l�"A�1�T��ڈ��(???)j�S�n�8v%� Eo��� mE��|�Έ�Ai�3uy5O����7Rܽ���"L��X���1�@�=?5�_'��{j�����Z3L��k��^x6g3i�����r.��N��&��9[��ɓW[+�� 7�����fe�3�K�%��0F��+V�ϛ+3�B�p,y;Z�NGK�uWg䁯9�v��t��ǒx�JY�O��K�iY��#FJy�Bzt�Q^�Y��Uϲ-͖��9��g�X,�X] f�P/�]d�䠾�̔m%Q��겓\q(�%'����/EN�P�1�o��� ���}��'��c�F��Ju��4��0ck�N��w�1��&]a ��^I�)����֓��\;�1��3��� �L��{>�+���a��Jg��#����P���>�5�a<�`>>˔�]�ߎey�-T���ʵ���r���8`dmNm���_mӐK�Ҏ-޴�� ��RQ%�d�l"��l�_��ie0.�$Xh|.jv,���l\ uyj�u\�/� B:�܀�]� _��T��I���lz�&c�A�g{g��O˂�O���O�M�t��7Y�~? ቶ`�7��'�w��#���˚�\��_��� a��d���[Ҭњ��]ɢ�A$ �l�v=E�66d �WA\̬fsǭ}x;';���?�UW�O��{�&|_a�C� |ȹ��pka�|���zf[S�������[�Jcf�A�&�L�U)Pd+)�_�$1�0�z�'�v\u�' +;�!���dž�]h�N�{ku��<��a��.0�,��]q��ZKao=ILo�z�rb&�{@K�i*7nX).�/�̶��ӒU�v �B֝���a��n��تx ���P�AG7M4N�?r;Z�����7�@�wA�q��RM5�8ۭ ��g��8�g���G�Tſ�O�{2��P3r��6�W,/��kC���p�V���~�"���T���6�/<�4�U�>��T�H�Fc�T�D�^I���!�����=&\Em�>b�,|T��d���n��=@\Wzi���D��&�f���1�t�mC�Ih��m��&�������84�!H�i�|�Z���� ��W���g����8�h�B] OvQ�u����+�}n�� FE�+q�&j����I�u��&��=!��T�b�@�ք0 �D�W�W�t�V}�������^�g�Erb`j��2 �wr�\Y5��L�Ρ���_�bNU�)~�e�Z�U�*�����:�vƀu2�W-W��W{KKo0�)��G�K.��{̮���v�/��p� !�� �w;`��b ������F���/���:����I�lm��Vc�,x~m<=|�_�>n����(A�����{�膾���m�,{3 �ӀH=٘�%��[USd��!J�|�f_�/ �߻��)I%���G�ܑ�G |N������d��BU5��qvG�c,���A?!��w��� �S��-i���Fr�P�_��E�+��)��V��f��������~�����������}"sk��cHN�<� 5I�r��1gu�ݗ�,N�I��f��k�s���0��: 0�<�\ͩB�܄ �:�f2A��mҞ�Z�6��3��t�����͟~����J�R9�] �,h������Z�@�{����9��W�il!�:��P��P���wK)���p���!���KuB\�7 uI�?(���/��r3����v,\'�8��qUa�ء���!��(b��n?�YfӸ����r�$���ה�~��_�&�8g�<(Mx$ZO�������u`q��:�N�Q !�%`���h:�� �~>�D���m�^��[V!y�6=� ��m��ѡ��p4�Iꎸ��1cE��QS�ٷ��W�C����*�����Q��=��3���&���-#,åCCG�������9�i��3�C��S[t>���qm����B��s���������o��� J�^s|����r��\ԺΦ�a�{��1��wT'���� �̓Q���B��\xx}��8��Of!��U�n��f�����bA��UD�cC} �r�������c ���^�X���k�Ɩk�6��^E�C�E�sՀ`�Ⱦ,i��v�� ٺe˟�!�co�64x4��A�ah��ˏ<��%�@�*|�\�TY����#:9��|?S�[������G hUw9���z]��D��-J6�m,ʭ��2�Iz�4W9��&���t�߁ R�Z�gP��H�dj�`%ap}�^떟��*fb{�Q) Dd_V����$��,�߁� @D�&f�2��S6��M�ɤ�)Q\F�i���5p��Wb'PN�R�>�����9��]��\8{B8�� ��ю�������%� ӏۙ{]�j,_Y>��!�l���'���H�["��;c?cy��1< 0ϑ���/�AAЛ�� ; �j�(!��1 [)5ݻK ��A7��"[�%"���{��H ���V�� ���m�K���VLn��9鿹8�At΀@����f`�1y�rЅ��q��7Nf���x)y��, 0e�"{�ƨ�"� o �6� �.|Tm.���-r �G� [ed���–q���]�X�oG*�1>�� م�p_Y{δ(N�|s��^{i�`��͒ QӴx+X.ݕ�kP�g]�޿�4��Q|�O��h�*c�W�G�4{~x�k��A:�{Yu�倀#ތM�K!�e�;ȩ����r������'���D&H�$�0�ߜ�w��Sq dH��P�y����z����h��d��"�;0��#I2�F{����. W�wl���|>s�\ŌO�&bO/4(z9ܭua��`��_3d�Qpt�/�P -��#5�,�M��� �pA:©�q�����NW��ډ�A���� �9nʺج���� �TSM��{J6?7��r�@�\����D��� �׶���s�f�TJj?"��D��`?��̒� b�#�%�C*v�$�{�$����5Ծ�F�s��y�e/8��h-�f�̰&(����Gj�L:U� 2�� ����v�_k����Y��gp,�k�WF�R������_C�R��N@���R�@�ߔ?A�w9���F("iNa-S���Q�o�3tDMLh*�#4k�T/iQ��Y*�G��m����)��8�hBm/�I�,g�ﯖ���Z��}�Cz�q@´��d.����L�ŕ�,��1�Z�܌�: ̪���F+J-'��c�tvJ8��]Q-��b��y �6;*J`r_�d ��'�G ~p��)'�C,�%F��E(��2�k�����lР�z�!�=t ��_�0��f7��� ;�p�|�U �% 1) { options.series.pie.tilt = 1; } else if (options.series.pie.tilt < 0) { options.series.pie.tilt = 0; } } }); plot.hooks.bindEvents.push(function(plot, eventHolder) { var options = plot.getOptions(); if (options.series.pie.show) { if (options.grid.hoverable) { eventHolder.unbind("mousemove").mousemove(onMouseMove); } if (options.grid.clickable) { eventHolder.unbind("click").click(onClick); } } }); plot.hooks.processDatapoints.push(function(plot, series, data, datapoints) { var options = plot.getOptions(); if (options.series.pie.show) { processDatapoints(plot, series, data, datapoints); } }); plot.hooks.drawOverlay.push(function(plot, octx) { var options = plot.getOptions(); if (options.series.pie.show) { drawOverlay(plot, octx); } }); plot.hooks.draw.push(function(plot, newCtx) { var options = plot.getOptions(); if (options.series.pie.show) { draw(plot, newCtx); } }); function processDatapoints(plot, series, datapoints) { if (!processed) { processed = true; canvas = plot.getCanvas(); target = $(canvas).parent(); options = plot.getOptions(); plot.setData(combine(plot.getData())); } } function combine(data) { var total = 0, combined = 0, numCombined = 0, color = options.series.pie.combine.color, newdata = []; // Fix up the raw data from Flot, ensuring the data is numeric for (var i = 0; i < data.length; ++i) { var value = data[i].data; // If the data is an array, we'll assume that it's a standard // Flot x-y pair, and are concerned only with the second value. // Note how we use the original array, rather than creating a // new one; this is more efficient and preserves any extra data // that the user may have stored in higher indexes. if ($.isArray(value) && value.length == 1) { value = value[0]; } if ($.isArray(value)) { // Equivalent to $.isNumeric() but compatible with jQuery < 1.7 if (!isNaN(parseFloat(value[1])) && isFinite(value[1])) { value[1] = +value[1]; } else { value[1] = 0; } } else if (!isNaN(parseFloat(value)) && isFinite(value)) { value = [1, +value]; } else { value = [1, 0]; } data[i].data = [value]; } // Sum up all the slices, so we can calculate percentages for each for (var i = 0; i < data.length; ++i) { total += data[i].data[0][1]; } // Count the number of slices with percentages below the combine // threshold; if it turns out to be just one, we won't combine. for (var i = 0; i < data.length; ++i) { var value = data[i].data[0][1]; if (value / total <= options.series.pie.combine.threshold) { combined += value; numCombined++; if (!color) { color = data[i].color; } } } for (var i = 0; i < data.length; ++i) { var value = data[i].data[0][1]; if (numCombined < 2 || value / total > options.series.pie.combine.threshold) { newdata.push( $.extend(data[i], { /* extend to allow keeping all other original data values and using them e.g. in labelFormatter. */ data: [[1, value]], color: data[i].color, label: data[i].label, angle: value * Math.PI * 2 / total, percent: value / (total / 100) }) ); } } if (numCombined > 1) { newdata.push({ data: [[1, combined]], color: color, label: options.series.pie.combine.label, angle: combined * Math.PI * 2 / total, percent: combined / (total / 100) }); } return newdata; } function draw(plot, newCtx) { if (!target) { return; // if no series were passed } var canvasWidth = plot.getPlaceholder().width(), canvasHeight = plot.getPlaceholder().height(), legendWidth = target.children().filter(".legend").children().width() || 0; ctx = newCtx; // WARNING: HACK! REWRITE THIS CODE AS SOON AS POSSIBLE! // When combining smaller slices into an 'other' slice, we need to // add a new series. Since Flot gives plugins no way to modify the // list of series, the pie plugin uses a hack where the first call // to processDatapoints results in a call to setData with the new // list of series, then subsequent processDatapoints do nothing. // The plugin-global 'processed' flag is used to control this hack; // it starts out false, and is set to true after the first call to // processDatapoints. // Unfortunately this turns future setData calls into no-ops; they // call processDatapoints, the flag is true, and nothing happens. // To fix this we'll set the flag back to false here in draw, when // all series have been processed, so the next sequence of calls to // processDatapoints once again starts out with a slice-combine. // This is really a hack; in 0.9 we need to give plugins a proper // way to modify series before any processing begins. processed = false; // calculate maximum radius and center point maxRadius = Math.min(canvasWidth, canvasHeight / options.series.pie.tilt) / 2; centerTop = canvasHeight / 2 + options.series.pie.offset.top; centerLeft = canvasWidth / 2; if (options.series.pie.offset.left == "auto") { if (options.legend.position.match("w")) { centerLeft += legendWidth / 2; } else { centerLeft -= legendWidth / 2; } if (centerLeft < maxRadius) { centerLeft = maxRadius; } else if (centerLeft > canvasWidth - maxRadius) { centerLeft = canvasWidth - maxRadius; } } else { centerLeft += options.series.pie.offset.left; } var slices = plot.getData(), attempts = 0; // Keep shrinking the pie's radius until drawPie returns true, // indicating that all the labels fit, or we try too many times. do { if (attempts > 0) { maxRadius *= REDRAW_SHRINK; } attempts += 1; clear(); if (options.series.pie.tilt <= 0.8) { drawShadow(); } } while (!drawPie() && attempts < REDRAW_ATTEMPTS) if (attempts >= REDRAW_ATTEMPTS) { clear(); target.prepend("
Could not draw pie with labels contained inside canvas
"); } if (plot.setSeries && plot.insertLegend) { plot.setSeries(slices); plot.insertLegend(); } // we're actually done at this point, just defining internal functions at this point function clear() { ctx.clearRect(0, 0, canvasWidth, canvasHeight); target.children().filter(".pieLabel, .pieLabelBackground").remove(); } function drawShadow() { var shadowLeft = options.series.pie.shadow.left; var shadowTop = options.series.pie.shadow.top; var edge = 10; var alpha = options.series.pie.shadow.alpha; var radius = options.series.pie.radius > 1 ? options.series.pie.radius : maxRadius * options.series.pie.radius; if (radius >= canvasWidth / 2 - shadowLeft || radius * options.series.pie.tilt >= canvasHeight / 2 - shadowTop || radius <= edge) { return; // shadow would be outside canvas, so don't draw it } ctx.save(); ctx.translate(shadowLeft,shadowTop); ctx.globalAlpha = alpha; ctx.fillStyle = "#000"; // center and rotate to starting position ctx.translate(centerLeft,centerTop); ctx.scale(1, options.series.pie.tilt); //radius -= edge; for (var i = 1; i <= edge; i++) { ctx.beginPath(); ctx.arc(0, 0, radius, 0, Math.PI * 2, false); ctx.fill(); radius -= i; } ctx.restore(); } function drawPie() { var startAngle = Math.PI * options.series.pie.startAngle; var radius = options.series.pie.radius > 1 ? options.series.pie.radius : maxRadius * options.series.pie.radius; // center and rotate to starting position ctx.save(); ctx.translate(centerLeft,centerTop); ctx.scale(1, options.series.pie.tilt); //ctx.rotate(startAngle); // start at top; -- This doesn't work properly in Opera // draw slices ctx.save(); var currentAngle = startAngle; for (var i = 0; i < slices.length; ++i) { slices[i].startAngle = currentAngle; drawSlice(slices[i].angle, slices[i].color, true); } ctx.restore(); // draw slice outlines if (options.series.pie.stroke.width > 0) { ctx.save(); ctx.lineWidth = options.series.pie.stroke.width; currentAngle = startAngle; for (var i = 0; i < slices.length; ++i) { drawSlice(slices[i].angle, options.series.pie.stroke.color, false); } ctx.restore(); } // draw donut hole drawDonutHole(ctx); ctx.restore(); // Draw the labels, returning true if they fit within the plot if (options.series.pie.label.show) { return drawLabels(); } else return true; function drawSlice(angle, color, fill) { if (angle <= 0 || isNaN(angle)) { return; } if (fill) { ctx.fillStyle = color; } else { ctx.strokeStyle = color; ctx.lineJoin = "round"; } ctx.beginPath(); if (Math.abs(angle - Math.PI * 2) > 0.000000001) { ctx.moveTo(0, 0); // Center of the pie } //ctx.arc(0, 0, radius, 0, angle, false); // This doesn't work properly in Opera ctx.arc(0, 0, radius,currentAngle, currentAngle + angle / 2, false); ctx.arc(0, 0, radius,currentAngle + angle / 2, currentAngle + angle, false); ctx.closePath(); //ctx.rotate(angle); // This doesn't work properly in Opera currentAngle += angle; if (fill) { ctx.fill(); } else { ctx.stroke(); } } function drawLabels() { var currentAngle = startAngle; var radius = options.series.pie.label.radius > 1 ? options.series.pie.label.radius : maxRadius * options.series.pie.label.radius; for (var i = 0; i < slices.length; ++i) { if (slices[i].percent >= options.series.pie.label.threshold * 100) { if (!drawLabel(slices[i], currentAngle, i)) { return false; } } currentAngle += slices[i].angle; } return true; function drawLabel(slice, startAngle, index) { if (slice.data[0][1] == 0) { return true; } // format label text var lf = options.legend.labelFormatter, text, plf = options.series.pie.label.formatter; if (lf) { text = lf(slice.label, slice); } else { text = slice.label; } if (plf) { text = plf(text, slice); } var halfAngle = ((startAngle + slice.angle) + startAngle) / 2; var x = centerLeft + Math.round(Math.cos(halfAngle) * radius); var y = centerTop + Math.round(Math.sin(halfAngle) * radius) * options.series.pie.tilt; var html = "" + text + ""; target.append(html); var label = target.children("#pieLabel" + index); var labelTop = (y - label.height() / 2); var labelLeft = (x - label.width() / 2); label.css("top", labelTop); label.css("left", labelLeft); // check to make sure that the label is not outside the canvas if (0 - labelTop > 0 || 0 - labelLeft > 0 || canvasHeight - (labelTop + label.height()) < 0 || canvasWidth - (labelLeft + label.width()) < 0) { return false; } if (options.series.pie.label.background.opacity != 0) { // put in the transparent background separately to avoid blended labels and label boxes var c = options.series.pie.label.background.color; if (c == null) { c = slice.color; } var pos = "top:" + labelTop + "px;left:" + labelLeft + "px;"; $("
") .css("opacity", options.series.pie.label.background.opacity) .insertBefore(label); } return true; } // end individual label function } // end drawLabels function } // end drawPie function } // end draw function // Placed here because it needs to be accessed from multiple locations function drawDonutHole(layer) { if (options.series.pie.innerRadius > 0) { // subtract the center layer.save(); var innerRadius = options.series.pie.innerRadius > 1 ? options.series.pie.innerRadius : maxRadius * options.series.pie.innerRadius; layer.globalCompositeOperation = "destination-out"; // this does not work with excanvas, but it will fall back to using the stroke color layer.beginPath(); layer.fillStyle = options.series.pie.stroke.color; layer.arc(0, 0, innerRadius, 0, Math.PI * 2, false); layer.fill(); layer.closePath(); layer.restore(); // add inner stroke layer.save(); layer.beginPath(); layer.strokeStyle = options.series.pie.stroke.color; layer.arc(0, 0, innerRadius, 0, Math.PI * 2, false); layer.stroke(); layer.closePath(); layer.restore(); // TODO: add extra shadow inside hole (with a mask) if the pie is tilted. } } //-- Additional Interactive related functions -- function isPointInPoly(poly, pt) { for(var c = false, i = -1, l = poly.length, j = l - 1; ++i < l; j = i) ((poly[i][1] <= pt[1] && pt[1] < poly[j][1]) || (poly[j][1] <= pt[1] && pt[1]< poly[i][1])) && (pt[0] < (poly[j][0] - poly[i][0]) * (pt[1] - poly[i][1]) / (poly[j][1] - poly[i][1]) + poly[i][0]) && (c = !c); return c; } function findNearbySlice(mouseX, mouseY) { var slices = plot.getData(), options = plot.getOptions(), radius = options.series.pie.radius > 1 ? options.series.pie.radius : maxRadius * options.series.pie.radius, x, y; for (var i = 0; i < slices.length; ++i) { var s = slices[i]; if (s.pie.show) { ctx.save(); ctx.beginPath(); ctx.moveTo(0, 0); // Center of the pie //ctx.scale(1, options.series.pie.tilt); // this actually seems to break everything when here. ctx.arc(0, 0, radius, s.startAngle, s.startAngle + s.angle / 2, false); ctx.arc(0, 0, radius, s.startAngle + s.angle / 2, s.startAngle + s.angle, false); ctx.closePath(); x = mouseX - centerLeft; y = mouseY - centerTop; if (ctx.isPointInPath) { if (ctx.isPointInPath(mouseX - centerLeft, mouseY - centerTop)) { ctx.restore(); return { datapoint: [s.percent, s.data], dataIndex: 0, series: s, seriesIndex: i }; } } else { // excanvas for IE doesn;t support isPointInPath, this is a workaround. var p1X = radius * Math.cos(s.startAngle), p1Y = radius * Math.sin(s.startAngle), p2X = radius * Math.cos(s.startAngle + s.angle / 4), p2Y = radius * Math.sin(s.startAngle + s.angle / 4), p3X = radius * Math.cos(s.startAngle + s.angle / 2), p3Y = radius * Math.sin(s.startAngle + s.angle / 2), p4X = radius * Math.cos(s.startAngle + s.angle / 1.5), p4Y = radius * Math.sin(s.startAngle + s.angle / 1.5), p5X = radius * Math.cos(s.startAngle + s.angle), p5Y = radius * Math.sin(s.startAngle + s.angle), arrPoly = [[0, 0], [p1X, p1Y], [p2X, p2Y], [p3X, p3Y], [p4X, p4Y], [p5X, p5Y]], arrPoint = [x, y]; // TODO: perhaps do some mathmatical trickery here with the Y-coordinate to compensate for pie tilt? if (isPointInPoly(arrPoly, arrPoint)) { ctx.restore(); return { datapoint: [s.percent, s.data], dataIndex: 0, series: s, seriesIndex: i }; } } ctx.restore(); } } return null; } function onMouseMove(e) { triggerClickHoverEvent("plothover", e); } function onClick(e) { triggerClickHoverEvent("plotclick", e); } // trigger click or hover event (they send the same parameters so we share their code) function triggerClickHoverEvent(eventname, e) { var offset = plot.offset(); var canvasX = parseInt(e.pageX - offset.left); var canvasY = parseInt(e.pageY - offset.top); var item = findNearbySlice(canvasX, canvasY); if (options.grid.autoHighlight) { // clear auto-highlights for (var i = 0; i < highlights.length; ++i) { var h = highlights[i]; if (h.auto == eventname && !(item && h.series == item.series)) { unhighlight(h.series); } } } // highlight the slice if (item) { highlight(item.series, eventname); } // trigger any hover bind events var pos = { pageX: e.pageX, pageY: e.pageY }; target.trigger(eventname, [pos, item]); } function highlight(s, auto) { //if (typeof s == "number") { // s = series[s]; //} var i = indexOfHighlight(s); if (i == -1) { highlights.push({ series: s, auto: auto }); plot.triggerRedrawOverlay(); } else if (!auto) { highlights[i].auto = false; } } function unhighlight(s) { if (s == null) { highlights = []; plot.triggerRedrawOverlay(); } //if (typeof s == "number") { // s = series[s]; //} var i = indexOfHighlight(s); if (i != -1) { highlights.splice(i, 1); plot.triggerRedrawOverlay(); } } function indexOfHighlight(s) { for (var i = 0; i < highlights.length; ++i) { var h = highlights[i]; if (h.series == s) return i; } return -1; } function drawOverlay(plot, octx) { var options = plot.getOptions(); var radius = options.series.pie.radius > 1 ? options.series.pie.radius : maxRadius * options.series.pie.radius; octx.save(); octx.translate(centerLeft, centerTop); octx.scale(1, options.series.pie.tilt); for (var i = 0; i < highlights.length; ++i) { drawHighlight(highlights[i].series); } drawDonutHole(octx); octx.restore(); function drawHighlight(series) { if (series.angle <= 0 || isNaN(series.angle)) { return; } //octx.fillStyle = parseColor(options.series.pie.highlight.color).scale(null, null, null, options.series.pie.highlight.opacity).toString(); octx.fillStyle = "rgba(255, 255, 255, " + options.series.pie.highlight.opacity + ")"; // this is temporary until we have access to parseColor octx.beginPath(); if (Math.abs(series.angle - Math.PI * 2) > 0.000000001) { octx.moveTo(0, 0); // Center of the pie } octx.arc(0, 0, radius, series.startAngle, series.startAngle + series.angle / 2, false); octx.arc(0, 0, radius, series.startAngle + series.angle / 2, series.startAngle + series.angle, false); octx.closePath(); octx.fill(); } } } // end init (plugin body) // define pie specific options and their default values var options = { series: { pie: { show: false, radius: "auto", // actual radius of the visible pie (based on full calculated radius if <=1, or hard pixel value) innerRadius: 0, /* for donut */ startAngle: 3/2, tilt: 1, shadow: { left: 5, // shadow left offset top: 15, // shadow top offset alpha: 0.02 // shadow alpha }, offset: { top: 0, left: "auto" }, stroke: { color: "#fff", width: 1 }, label: { show: "auto", formatter: function(label, slice) { return "
" + label + "
" + Math.round(slice.percent) + "%
"; }, // formatter function radius: 1, // radius at which to place the labels (based on full calculated radius if <=1, or hard pixel value) background: { color: null, opacity: 0 }, threshold: 0 // percentage at which to hide the label (i.e. the slice is too narrow) }, combine: { threshold: -1, // percentage at which to combine little slices into one larger slice color: null, // color to give the new slice (auto-generated if null) label: "Other" // label to give the new slice }, highlight: { //color: "#fff", // will add this functionality once parseColor is available opacity: 0.5 } } } }; $.plot.plugins.push({ init: init, options: options, name: "pie", version: "1.1" }); })(jQuery);