<% osm = @trans.t.osm misc = @trans.t.misc %> var create_flexigrid_for = {}; ['plain', 'colon', 'letters', 'space', 'problem', 'rest'].forEach(function(category) { create_flexigrid_for[category] = function() { create_flexigrid('grid-' + category, { url: '/api/4/keys/all?filter=characters_' + category + '&include=prevalent_values', colModel: [ { display: '<%= h(osm.key) %>', name: 'key', width: 250, sortable: true }, { display: ' <%= h(osm.objects) %>', name: 'count_all', width: 150, sortable: true, align: 'center' }, { display: '<%= h(osm.users) %>', name: 'users_all', width: 44, sortable: true, align: 'right' }, { display: 'Wiki', name: 'in_wiki', width: 20, sortable: true, align: 'center' }, { display: '<%= h(osm.values) %>', name: 'values_all', width: 70, sortable: true, align: 'right' }, { display: '<%= h(misc.prevalent_values) %>', name: 'prevalent_values', width: 600, sortable: true } ], searchitems: [ { display: '<%= h(osm.key) %>', name: 'key' } ], sortname: 'count_all', sortorder: 'desc', preProcess: function(data) { data.rows = jQuery.map(data.data, function(row, i) { return { 'cell': [ link_to_key(row.key), fmt_value_with_percent(row.count_all, row.count_all_fraction), fmt_with_ts(row.users_all), fmt_checkmark(row.in_wiki), fmt_with_ts(row.values_all), fmt_prevalent_value_list(row.key, row.prevalent_values) ] }; }); return data; } }); }; }); function page_init() { up = function() { window.location = '/reports'; }; init_tabs([]); var w = 968, h = 50, max = <%= @db.stats('num_keys') %>, data = <%= i = '@'; %w(plain colon letters space problem rest).map{ |type| i=i.next; { :label => i, :value => @db.stats('characters_in_keys_' + type) } }.to_json %>; var colors = { 'A': '#2ca02c', 'B': '#98df8a', 'C': '#dbdb8d', 'D': '#d62728', 'E': '#ff9896', 'F': '#aec7e8' }; var y = 0; data.forEach(function(d) { d['y'] = y; y += d['value']; }); var scale = d3.scale.linear() .domain([0, max]) .range([0, w]); var chart = d3.select('#canvas').append('svg') .attr("width", w) .attr("height", h); chart.selectAll("rect") .data(data) .enter() .append("svg:g") .attr('transform', function(d) { return 'translate(' + scale(d['y']) + ', 0)'; }) .call(function(c) { c.append("rect") .attr('height', 20) .attr('width', function(d) { return scale(d['value']); }) .style('fill', function(d) { return colors[d['label']]; }); }) .append("text") .attr('x', function(d) { return scale(d['value'] / 2); }) .attr('y', 34) .style('text-anchor', 'middle') .text(function(d) { return d['label']; }); }