[tor-commits] [metrics-web/master] Replace broken SVGs with higher-resolution PNGs.

karsten at torproject.org karsten at torproject.org
Fri Nov 10 08:11:57 UTC 2017


commit f748969aa063a188e7215ec6b7ff8c1c41ce25c1
Author: Karsten Loesing <karsten.loesing at 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>



More information about the tor-commits mailing list