Files
danbooru/app/components/time_series_component/time_series_component.html.erb
evazion f73d2e3956 reports: add ability to group reports by column.
Add ability to group reports by various columns. For example, you can see
the posts by the top 10 uploaders over time, or posts grouped by rating
over time.
2022-10-22 04:05:10 -05:00

42 lines
1.2 KiB
Plaintext

<div class="flex justify-end text-xs mb-2">
<% if mode == :table %>
<%= link_to "Chart", current_page_path(search: { **search_params, mode: "chart" }) %>
<% else %>
<%= link_to "Table", current_page_path(search: { **search_params, mode: "table" }) %>
<% end %>
</div>
<% if mode == :table %>
<table class="striped autofit" width="100%">
<thead>
<% dataframe.types.keys.each do |column| %>
<%= tag.th(column.to_s.titleize, class: ("col-expand" if column == dataframe.types.keys.last)) %>
<% end %>
</thead>
<tbody>
<% dataframe.each_row do |row| %>
<tr>
<% dataframe.types.keys.each do |column| %>
<td>
<%= row[column] %>
</td>
<% end %>
<tr>
<% end %>
</tbody>
</table>
<% elsif mode == :chart %>
<div class="line-chart" style="width: 100%; height: 80vh;"></div>
<script type="text/javascript">
var data = <%= raw dataframe.each_row.map(&:values).to_json %>;
var columns = <%= raw dataframe.types.keys.without("date").to_json %>;
var chart = new Danbooru.TimeSeriesComponent({
container: $(".line-chart").get(0),
data: data,
columns: columns,
});
</script>
<% end %>