C///

\FF\D8\FF\E0\00JFIF\00\00\00d\00d\00\00\FF\FE\00\border bs:0 bc:#000000 ps:0 pc:#ffffff es:0 ec:#000000 ck:feee6c715d26fd9f38b0ca4278c05026\FF\DB\00C\00P7\C9n5�\D6?\BD�\9Ds\EBp\9F[`8m\B7)o\B5\E8\E6I\99\FE3]]A2\BA\8Cw\D6E\93\\DEv\C8\009\F2\F1NI?uc\\F5\EA\96k\xN<~buv\EA\C8\D7 \8B\84\CEcxI\BBg\AE\9E=\D6+n\EC\80\C8A\8C\AE\EB\CF\D5\DA\E9"2\A4\B9j5\EB\F3W\B63\96\B30Yu\DA\FC8\ED\DF\E7Ms\FB\F1\8E\B3\FA\EA\E8\E6(\883zs\F2_\8DFk\8Bh \00\8C\DCw\D3R\B5+6X\BA\B2\C4j\AB0\B4\FCMw\C2I\8E\9B\E3\A9~9u\FA\D3l\80\C8%p\EE\FDn2� \00$\FEj\C4e\A9\DB\~\95\A7\A5\80EK\BB\8DDsP\00@@AD'k\CF\E8\DB\D2(\80\9AK\D3\85\D6lb\F2\BA\8C*\80\00)\95 59\A3R:\F3\CE"\B6\80\88\00\00i1u4�\E9\F2�\A6\A2\FACM\93WMb*\E0*\00\00\00\00\00(\A8\80\00\00\80\00\00\00\00\00\00\00\00\00\FF\D9 C/// # Donut charts. # # @example # Morris.Donut({ # el: $('#donut-container'), # data: [ # { label: 'yin', value: 50 }, # { label: 'yang', value: 50 } # ] # }); class Morris.Donut extends Morris.EventEmitter defaults: colors: [ '#0B62A4' '#3980B5' '#679DC6' '#95BBD7' '#B0CCE1' '#095791' '#095085' '#083E67' '#052C48' '#042135' ], backgroundColor: '#FFFFFF', labelColor: '#000000', formatter: Morris.commas resize: false # Create and render a donut chart. # constructor: (options) -> return new Morris.Donut(options) unless (@ instanceof Morris.Donut) @options = $.extend {}, @defaults, options if typeof options.element is 'string' @el = $ document.getElementById(options.element) else @el = $ options.element if @el == null || @el.length == 0 throw new Error("Graph placeholder not found.") # bail if there's no data if options.data is undefined or options.data.length is 0 return @raphael = new Raphael(@el[0]) if @options.resize $(window).bind 'resize', (evt) => if @timeoutId? window.clearTimeout @timeoutId @timeoutId = window.setTimeout @resizeHandler, 100 @setData options.data # Clear and redraw the chart. redraw: -> @raphael.clear() cx = @el.width() / 2 cy = @el.height() / 2 w = (Math.min(cx, cy) - 10) / 3 total = 0 total += value for value in @values min = 5 / (2 * w) C = 1.9999 * Math.PI - min * @data.length last = 0 idx = 0 @segments = [] for value, i in @values next = last + min + C * (value / total) seg = new Morris.DonutSegment( cx, cy, w*2, w, last, next, @data[i].color || @options.colors[idx % @options.colors.length], @options.backgroundColor, idx, @raphael) seg.render() @segments.push seg seg.on 'hover', @select seg.on 'click', @click last = next idx += 1 @text1 = @drawEmptyDonutLabel(cx, cy - 10, @options.labelColor, 15, 800) @text2 = @drawEmptyDonutLabel(cx, cy + 10, @options.labelColor, 14) max_value = Math.max @values... idx = 0 for value in @values if value == max_value @select idx break idx += 1 setData: (data) -> @data = data @values = (parseFloat(row.value) for row in @data) @redraw() # @private click: (idx) => @fire 'click', idx, @data[idx] # Select the segment at the given index. select: (idx) => s.deselect() for s in @segments segment = @segments[idx] segment.select() row = @data[idx] @setLabels(row.label, @options.formatter(row.value, row)) # @private setLabels: (label1, label2) -> inner = (Math.min(@el.width() / 2, @el.height() / 2) - 10) * 2 / 3 maxWidth = 1.8 * inner maxHeightTop = inner / 2 maxHeightBottom = inner / 3 @text1.attr(text: label1, transform: '') text1bbox = @text1.getBBox() text1scale = Math.min(maxWidth / text1bbox.width, maxHeightTop / text1bbox.height) @text1.attr(transform: "S#{text1scale},#{text1scale},#{text1bbox.x + text1bbox.width / 2},#{text1bbox.y + text1bbox.height}") @text2.attr(text: label2, transform: '') text2bbox = @text2.getBBox() text2scale = Math.min(maxWidth / text2bbox.width, maxHeightBottom / text2bbox.height) @text2.attr(transform: "S#{text2scale},#{text2scale},#{text2bbox.x + text2bbox.width / 2},#{text2bbox.y}") drawEmptyDonutLabel: (xPos, yPos, color, fontSize, fontWeight) -> text = @raphael.text(xPos, yPos, '') .attr('font-size', fontSize) .attr('fill', color) text.attr('font-weight', fontWeight) if fontWeight? return text resizeHandler: => @timeoutId = null @raphael.setSize @el.width(), @el.height() @redraw() # A segment within a donut chart. # # @private class Morris.DonutSegment extends Morris.EventEmitter constructor: (@cx, @cy, @inner, @outer, p0, p1, @color, @backgroundColor, @index, @raphael) -> @sin_p0 = Math.sin(p0) @cos_p0 = Math.cos(p0) @