Author: croberts Date: 2011-11-03 14:27:12 +0000 (Thu, 03 Nov 2011) New Revision: 5108
Modified: branches/noflash/cumin/python/cumin/grid/dashboard.py branches/noflash/cumin/python/cumin/grid/dashboard.strings branches/noflash/cumin/resources/app.js Log: Replacing the png pie charts with jqplot pie charts. Still using the same color schemes for now. Mostly just a 1-for-1 replacement functionality-wise, but we can definitely add some features to the new pie charts that were not possible before.
Modified: branches/noflash/cumin/python/cumin/grid/dashboard.py =================================================================== --- branches/noflash/cumin/python/cumin/grid/dashboard.py 2011-11-03 13:21:58 UTC (rev 5107) +++ branches/noflash/cumin/python/cumin/grid/dashboard.py 2011-11-03 14:27:12 UTC (rev 5108) @@ -132,6 +132,9 @@ self.chart_link = None self.popup_chart = self.DefinitionSetPopup(app, "popup_chart") self.add_child(self.popup_chart) + + self.pie_width = "150px" + self.pie_height = "150px"
self.pie_tmpl = WidgetTemplate(self, "pie_html")
@@ -190,6 +193,10 @@ def render_pie_src(self, session): slices = self.get_pie_slices(session) return PieChartPage.get_href(slices, self.color_scheme, self.radius) + + def render_pie_slices(self, session): + items = self.do_get_items(session) + return [int(self.get_item_value(session, x)) or 0 for x in items if not self.is_total(x)]
def render_width(self, session): return self.radius * 2 @@ -201,6 +208,26 @@ # don't include total lines, convert None to 0 items = self.do_get_items(session) return [self.get_item_value(session, x) or 0 for x in items if not self.is_total(x)] + + def render_id_nodots(self, session): + return self.render_id(session).replace(".", "_") + + def render_pie_width(self, session): + if self.has_pie_chart: + return self.pie_width + else: + return "0px" + + def render_pie_height(self, session): + if self.has_pie_chart: + return self.pie_height + else: + return "0px" + + def render_colors(self, session): + colors = PieChartPage.color_schemes[self.color_scheme] + color_list = ["#%s" % rgb_to_string(*color) for color in colors] + return color_list
class DefinitionSetPopup(Widget): def render_chart_href(self, session):
Modified: branches/noflash/cumin/python/cumin/grid/dashboard.strings =================================================================== --- branches/noflash/cumin/python/cumin/grid/dashboard.strings 2011-11-03 13:21:58 UTC (rev 5107) +++ branches/noflash/cumin/python/cumin/grid/dashboard.strings 2011-11-03 14:27:12 UTC (rev 5108) @@ -183,11 +183,16 @@ {legend_styles} </style> <h3>{title}</h3> + <div> + <div id="{id_nodots}" style="width:{pie_width};height:{pie_height};float:left;" alt="pie_chart" title="{title}"></div> + <div style="float:left;"> <dl> {items} </dl> + </div> {chart} - <div class="icons"> + </div> + <div class="icons" style="clear:both;"> {export} {popup_chart} </div> @@ -202,7 +207,17 @@ </div>
[DefinitionSet.pie_html] - <img src="{pie_src}" alt="pie_chart" title="{title}" width="{width}" height="{height}"/> + <script type="text/javascript" charset="utf-8"> + //<![CDATA[ + window.addEvent("domready", function () { + values = {pie_slices}; + colors = {colors}; + updatePieChart("{id_nodots}", values, colors); + }); +//]]> +</script> + +
[DefinitionSet.timeseries_html] {timeseries}
Modified: branches/noflash/cumin/resources/app.js =================================================================== --- branches/noflash/cumin/resources/app.js 2011-11-03 13:21:58 UTC (rev 5107) +++ branches/noflash/cumin/resources/app.js 2011-11-03 14:27:12 UTC (rev 5108) @@ -551,7 +551,7 @@ y2axis: { autoscale: true, min:0, - tickOptions:{formatString:'%d'}, + tickOptions:{formatString:'%.0f'}, numberTicks:4, }, xaxis: { @@ -560,7 +560,8 @@ min:dataopts['xmin'] / dataContainer['x_axis_normalizer'], max:dataopts['xmax'] / dataContainer['x_axis_normalizer'], //ticks:[[-3600, "60 min"], [-2700, "45 min"], [-1800, "30 min"], [-900, "15 min"], [0, "0"]] - tickOptions:{formatString:'%g ' + dataContainer['x_axis_unit_label']}, + tickOptions:{formatString:'%.0f ' + dataContainer['x_axis_unit_label'], + formatter: x_axis_Formatter,}, } }, series: getSeries(dataContainer), @@ -579,7 +580,8 @@ markerOptions: {show:true, lineWidth:2, style:'filledCircle', - size:4}, + size:4, + }, }, highlighter: { tooltipaxes:'xy', @@ -608,4 +610,45 @@ } }
+x_axis_Formatter = function (format, val) { + if (typeof val == 'number') { + if (!format) { + format = $j.jqplot.config.defaultTickFormatString; + } + return ($j.jqplot.sprintf(format, val)).replace(/-/,""); // hack to prevent negative axis labels, which we don't have + } + else { + return String(val); + } +}
+updatePieChart = function (piediv, vals, colors) { + var data = vals; + + var plot1 = jQuery.jqplot (piediv, [data], + { + grid: { + drawBorder: false, + drawGridlines: false, + background: '#ffffff', + shadow:false + }, + seriesDefaults: { + renderer: jQuery.jqplot.PieRenderer, + rendererOptions: { + showDataLabels: false, + dataLabels: 'value', + dataLabelThreshold: 3, + shadow:true, + shadowOffset: 1, + shadowAlpha: 0.06, + shadowDepth: 5, + padding:5, + hilightMouseOver: false + } + }, + legend: { show:false, location: 'e' }, + seriesColors: colors + } + ); + }