commit f748969aa063a188e7215ec6b7ff8c1c41ce25c1 Author: Karsten Loesing karsten.loesing@gmx.net Date: Fri Nov 10 09:05:51 2017 +0100

Replace broken SVGs with higher-resolution PNGs.

In fact, we're generating all PNGs on higher resolution now and scaling them down on the graph pages. If this turns out to be a performance issue, we'll have to provide two versions, but let's try it out first.

Fixes #23965. --- website/rserve/graphs.R | 46 +++++++++++----------- .../metrics/web/graphs/GraphImageServlet.java | 3 +- website/src/main/resources/etc/web.xml | 26 ------------ website/src/main/resources/web/WEB-INF/graph.jsp | 6 +-- 4 files changed, 27 insertions(+), 54 deletions(-)

diff --git a/website/rserve/graphs.R b/website/rserve/graphs.R index ebc3d72..00471cf 100644 --- a/website/rserve/graphs.R +++ b/website/rserve/graphs.R @@ -308,7 +308,7 @@ plot_networksize <- function(start, end, path) { scale_colour_hue("", breaks = c("relays", "bridges"), labels = c("Relays", "Bridges")) + ggtitle("Number of relays\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_relaycountries <- function(start, end, country, path) { @@ -343,7 +343,7 @@ plot_relaycountries <- function(start, end, country, path) { scale_y_continuous(name = "", limits = c(0, max(s$relays, na.rm = TRUE)), formatter = formatter) + ggtitle(title) - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_versions <- function(start, end, path) { @@ -382,7 +382,7 @@ plot_versions <- function(start, end, path) { values = colours[colours$breaks %in% visible_versions, 2], breaks = visible_versions) + ggtitle("Relay versions\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_platforms <- function(start, end, path) { @@ -411,7 +411,7 @@ plot_platforms <- function(start, end, path) { breaks = c("Linux", "Darwin", "BSD", "Windows", "Other"), values = c("#E69F00", "#56B4E9", "#009E73", "#0072B2", "#333333")) + ggtitle("Relay platforms\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_bandwidth <- function(start, end, path) { @@ -442,7 +442,7 @@ plot_bandwidth <- function(start, end, path) { labels = c("Advertised bandwidth", "Bandwidth history")) + ggtitle("Total relay bandwidth") + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_bwhist_flags <- function(start, end, path) { @@ -488,7 +488,7 @@ plot_bwhist_flags <- function(start, end, path) { values = c("#E69F00", "#56B4E9", "#009E73", "#0072B2")) + ggtitle("Bandwidth history by relay flags") + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_dirbytes <- function(start, end, path) { @@ -518,7 +518,7 @@ plot_dirbytes <- function(start, end, path) { labels = c("Written dir bytes", "Read dir bytes")) + ggtitle("Number of bytes spent on answering directory requests") + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_relayflags <- function(start, end, flags, path) { @@ -559,7 +559,7 @@ plot_relayflags <- function(start, end, flags, path) { "#56B4E9", "#009E73", "#EE6A50", "#000000", "#0072B2"), breaks = flags, labels = flags) + ggtitle("Number of relays with relay flags assigned\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_torperf <- function(start, end, source, server, filesize, path) { @@ -611,7 +611,7 @@ plot_torperf <- function(start, end, source, server, filesize, path) { ggtitle(paste("Time in seconds to complete", filesizeStr, "request to", server, "server")) + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_torperf_failures <- function(start, end, source, server, filesize, path) { @@ -663,7 +663,7 @@ plot_torperf_failures <- function(start, end, source, server, filesize, path) { ggtitle(paste("Timeouts and failures of", filesizeStr, "requests to", server, "server")) + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_connbidirect <- function(start, end, path) { @@ -700,7 +700,7 @@ plot_connbidirect <- function(start, end, path) { "Mostly reading")) + ggtitle("Fraction of connections used uni-/bidirectionally\n") + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_bandwidth_flags <- function(start, end, path) { @@ -765,7 +765,7 @@ plot_bandwidth_flags <- function(start, end, path) { ggtitle(paste("Advertised bandwidth and bandwidth history by", "relay flags")) + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_userstats <- function(start, end, node, variable, value, events, @@ -901,7 +901,7 @@ plot_userstats <- function(start, end, node, variable, value, events, ifelse(value == 'websocket', 'Flash proxy/websocket', value)))))) } - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_userstats_relay_country <- function(start, end, country, events, @@ -959,7 +959,7 @@ plot_userstats_bridge_combined <- function(start, end, country, path) { scale_fill_hue(paste("Top-", top, " transports", sep = "")) + ggtitle(title) + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) } }

@@ -989,7 +989,7 @@ plot_advbwdist_perc <- function(start, end, p, path) { scale_colour_hue(name = "Percentile", breaks = rev(levels(t$percentile))) + ggtitle("Advertised bandwidth distribution\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_advbwdist_relay <- function(start, end, n, path) { @@ -1016,7 +1016,7 @@ plot_advbwdist_relay <- function(start, end, n, path) { limits = c(0, max(t$advbw, na.rm = TRUE))) + scale_colour_hue(name = "n", breaks = levels(t$relay)) + ggtitle("Advertised bandwidth of n-th fastest relays\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_hidserv_dir_onions_seen <- function(start, end, path) { @@ -1038,7 +1038,7 @@ plot_hidserv_dir_onions_seen <- function(start, end, path) { date_minor_breaks = date_breaks$minor) + scale_y_continuous(name = "") + ggtitle("Unique .onion addresses\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_hidserv_rend_relayed_cells <- function(start, end, path) { @@ -1062,7 +1062,7 @@ plot_hidserv_rend_relayed_cells <- function(start, end, path) { date_minor_breaks = date_breaks$minor) + scale_y_continuous(name = "") + ggtitle("Onion-service traffic in Mbit/s\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_hidserv_frac_reporting <- function(start, end, path) { @@ -1094,7 +1094,7 @@ plot_hidserv_frac_reporting <- function(start, end, path) { ggtitle(paste("Fraction of relays reporting onion-service", "statistics")) + theme(legend.position = "top") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_webstats_tb <- function(start, end, path) { @@ -1123,7 +1123,7 @@ plot_webstats_tb <- function(start, end, path) { theme(strip.text.y = element_text(angle = 0, hjust = 0, size = rel(1.5)), strip.background = element_rect(fill = NA)) + ggtitle("Tor Browser downloads and updates\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_webstats_tb_platform <- function(start, end, path) { @@ -1150,7 +1150,7 @@ plot_webstats_tb_platform <- function(start, end, path) { theme(strip.text.y = element_text(angle = 0, hjust = 0, size = rel(1.5)), strip.background = element_rect(fill = NA)) + ggtitle("Tor Browser downloads by platform\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_webstats_tb_locale <- function(start, end, path) { @@ -1181,7 +1181,7 @@ plot_webstats_tb_locale <- function(start, end, path) { theme(strip.text.y = element_text(angle = 0, hjust = 0, size = rel(1.5)), strip.background = element_rect(fill = NA)) + ggtitle("Tor Browser downloads by locale\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

plot_webstats_tm <- function(start, end, path) { @@ -1208,6 +1208,6 @@ plot_webstats_tm <- function(start, end, path) { theme(strip.text.y = element_text(angle = 0, hjust = 0, size = rel(1.5)), strip.background = element_rect(fill = NA)) + ggtitle("Tor Messenger downloads and updates\n") - ggsave(filename = path, width = 8, height = 5, dpi = 72) + ggsave(filename = path, width = 8, height = 5, dpi = 150) }

diff --git a/website/src/main/java/org/torproject/metrics/web/graphs/GraphImageServlet.java b/website/src/main/java/org/torproject/metrics/web/graphs/GraphImageServlet.java index 2ac76c9..f544b9f 100644 --- a/website/src/main/java/org/torproject/metrics/web/graphs/GraphImageServlet.java +++ b/website/src/main/java/org/torproject/metrics/web/graphs/GraphImageServlet.java @@ -41,8 +41,7 @@ public class GraphImageServlet extends HttpServlet { String requestedGraph = request.getRequestURI(); String fileType = null; if (requestedGraph.endsWith(".png") - || requestedGraph.endsWith(".pdf") - || requestedGraph.endsWith(".svg")) { + || requestedGraph.endsWith(".pdf")) { fileType = requestedGraph.substring(requestedGraph.length() - 3); requestedGraph = requestedGraph.substring(0, requestedGraph.length() - 4); diff --git a/website/src/main/resources/etc/web.xml b/website/src/main/resources/etc/web.xml index a28a39e..2d63643 100644 --- a/website/src/main/resources/etc/web.xml +++ b/website/src/main/resources/etc/web.xml @@ -117,82 +117,56 @@ <servlet-name>GraphImage</servlet-name> <url-pattern>/networksize.png</url-pattern> <url-pattern>/networksize.pdf</url-pattern> - <url-pattern>/networksize.svg</url-pattern> <url-pattern>/relaycountries.png</url-pattern> <url-pattern>/relaycountries.pdf</url-pattern> - <url-pattern>/relaycountries.svg</url-pattern> <url-pattern>/relayflags.png</url-pattern> <url-pattern>/relayflags.pdf</url-pattern> - <url-pattern>/relayflags.svg</url-pattern> <url-pattern>/versions.png</url-pattern> <url-pattern>/versions.pdf</url-pattern> - <url-pattern>/versions.svg</url-pattern> <url-pattern>/platforms.png</url-pattern> <url-pattern>/platforms.pdf</url-pattern> - <url-pattern>/platforms.svg</url-pattern> <url-pattern>/bandwidth.png</url-pattern> <url-pattern>/bandwidth.pdf</url-pattern> - <url-pattern>/bandwidth.svg</url-pattern> <url-pattern>/bwhist-flags.png</url-pattern> <url-pattern>/bwhist-flags.pdf</url-pattern> - <url-pattern>/bwhist-flags.svg</url-pattern> <url-pattern>/bandwidth-flags.png</url-pattern> <url-pattern>/bandwidth-flags.pdf</url-pattern> - <url-pattern>/bandwidth-flags.svg</url-pattern> <url-pattern>/dirbytes.png</url-pattern> <url-pattern>/dirbytes.pdf</url-pattern> - <url-pattern>/dirbytes.svg</url-pattern> <url-pattern>/torperf.png</url-pattern> <url-pattern>/torperf.pdf</url-pattern> - <url-pattern>/torperf.svg</url-pattern> <url-pattern>/torperf-failures.png</url-pattern> <url-pattern>/torperf-failures.pdf</url-pattern> - <url-pattern>/torperf-failures.svg</url-pattern> <url-pattern>/connbidirect.png</url-pattern> <url-pattern>/connbidirect.pdf</url-pattern> - <url-pattern>/connbidirect.svg</url-pattern> <url-pattern>/userstats-relay-country.png</url-pattern> <url-pattern>/userstats-relay-country.pdf</url-pattern> - <url-pattern>/userstats-relay-country.svg</url-pattern> <url-pattern>/userstats-bridge-country.png</url-pattern> <url-pattern>/userstats-bridge-country.pdf</url-pattern> - <url-pattern>/userstats-bridge-country.svg</url-pattern> <url-pattern>/userstats-bridge-transport.png</url-pattern> <url-pattern>/userstats-bridge-transport.pdf</url-pattern> - <url-pattern>/userstats-bridge-transport.svg</url-pattern> <url-pattern>/userstats-bridge-combined.png</url-pattern> <url-pattern>/userstats-bridge-combined.pdf</url-pattern> - <url-pattern>/userstats-bridge-combined.svg</url-pattern> <url-pattern>/userstats-bridge-version.png</url-pattern> <url-pattern>/userstats-bridge-version.pdf</url-pattern> - <url-pattern>/userstats-bridge-version.svg</url-pattern> <url-pattern>/advbwdist-perc.png</url-pattern> <url-pattern>/advbwdist-perc.pdf</url-pattern> - <url-pattern>/advbwdist-perc.svg</url-pattern> <url-pattern>/advbwdist-relay.png</url-pattern> <url-pattern>/advbwdist-relay.pdf</url-pattern> - <url-pattern>/advbwdist-relay.svg</url-pattern> <url-pattern>/hidserv-dir-onions-seen.png</url-pattern> <url-pattern>/hidserv-dir-onions-seen.pdf</url-pattern> - <url-pattern>/hidserv-dir-onions-seen.svg</url-pattern> <url-pattern>/hidserv-rend-relayed-cells.png</url-pattern> <url-pattern>/hidserv-rend-relayed-cells.pdf</url-pattern> - <url-pattern>/hidserv-rend-relayed-cells.svg</url-pattern> <url-pattern>/hidserv-frac-reporting.png</url-pattern> <url-pattern>/hidserv-frac-reporting.pdf</url-pattern> - <url-pattern>/hidserv-frac-reporting.svg</url-pattern> <url-pattern>/webstats-tb.png</url-pattern> <url-pattern>/webstats-tb.pdf</url-pattern> - <url-pattern>/webstats-tb.svg</url-pattern> <url-pattern>/webstats-tb-platform.png</url-pattern> <url-pattern>/webstats-tb-platform.pdf</url-pattern> - <url-pattern>/webstats-tb-platform.svg</url-pattern> <url-pattern>/webstats-tb-locale.png</url-pattern> <url-pattern>/webstats-tb-locale.pdf</url-pattern> - <url-pattern>/webstats-tb-locale.svg</url-pattern> <url-pattern>/webstats-tm.png</url-pattern> <url-pattern>/webstats-tm.pdf</url-pattern> - <url-pattern>/webstats-tm.svg</url-pattern> </servlet-mapping>

<servlet> diff --git a/website/src/main/resources/web/WEB-INF/graph.jsp b/website/src/main/resources/web/WEB-INF/graph.jsp index d476dad..98f5a21 100644 --- a/website/src/main/resources/web/WEB-INF/graph.jsp +++ b/website/src/main/resources/web/WEB-INF/graph.jsp @@ -33,7 +33,7 @@ <div class="row"> <div class="col-md-8">

- <img src="${id}.png${parameters}" width="576" height="360" alt="${title} graph"> + <img src="${id}.png${parameters}" width="600" height="375" alt="${title} graph">

${description}

@@ -155,8 +155,8 @@ </form>

<p>Download graph as -<a href="${id}.pdf${parameters}">PDF</a> or -<a href="${id}.svg${parameters}">SVG</a>.</p> +<a href="${id}.png${parameters}">PNG</a> or +<a href="${id}.pdf${parameters}">PDF</a>.</p>

<c:if test="${fn:length(data) > 0}"> <p>Download underlying data:</p>