From: Ant Zucaro Date: Thu, 5 Sep 2013 18:52:14 +0000 (-0400) Subject: Initial player damage view. X-Git-Url: http://de.git.xonotic.org/?p=xonotic%2Fxonstat.git;a=commitdiff_plain;h=b8eb63bddc89ebd6cdc53b160250e6a2c2774b5d Initial player damage view. --- diff --git a/xonstat/static/js/weaponCharts.js b/xonstat/static/js/weaponCharts.js new file mode 100644 index 0000000..9977c4a --- /dev/null +++ b/xonstat/static/js/weaponCharts.js @@ -0,0 +1,50 @@ + var drawDamageChart = function(data) { + // the chart should fill the "damageChart" div + var width = document.getElementById("damageChart").offsetWidth; + + // transform the dataset into something nvd3 can use + var transformedData = d3.nest() + .key(function(d) { return d.weapon_cd; }).entries(data.weapon_stats); + + // transform games list into a map such that games[game_id] = linear sequence + var games = {}; + data.games.forEach(function(v,i){ games[v] = i; }); + + // margin model + var margin = {top: 20, right: 30, bottom: 30, left: 40}, + height = 500 - margin.top - margin.bottom; + + width -= margin.left - margin.right; + + // colors + var colors = d3.scale.category20(); + keyColor = function(d, i) {return colors(d.key)}; + + var chart; + nv.addGraph(function() { + chart = nv.models.stackedAreaChart() + .margin(margin) + .width(width) + .height(height) + .x(function(d) { return games[d.game_id] }) + .y(function(d) { return d.actual }) + .color(keyColor); + + chart.xAxis + .axisLabel("Game ID") + .showMaxMin(false) + .ticks(5) + .tickFormat(function(d) { return data.games[d]; }); + + chart.yAxis + .tickFormat(d3.format(',02d')); + + d3.select('#damageChartSVG') + .datum(transformedData) + .transition().duration(500).call(chart); + + nv.utils.windowResize(chart.update); + + return chart; + }); + } diff --git a/xonstat/templates/nvd3_damage.mako b/xonstat/templates/nvd3_damage.mako index 6ec21ab..363cfc4 100644 --- a/xonstat/templates/nvd3_damage.mako +++ b/xonstat/templates/nvd3_damage.mako @@ -1,10 +1,19 @@ - - +<%inherit file="base.mako"/> +<%namespace name="nav" file="nav.mako" /> +<%block name="navigation"> +${nav.nav('players')} + + +<%block name="title"> +Player Damage + + +<%block name="css"> +${parent.css()} - - -
- -
+ +<%block name="js"> +${parent.js()} + + + + +
+
+ +
+ +
+ +
+