From 4d67b58728c96179094886e0890b1f8fe2f197f3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Konstantin=20K=C3=A4fer?= <mail@kkaefer.com>
Date: Mon, 21 Nov 2016 12:10:23 +0100
Subject: formatting

---
 metrics/binary-size/index.html | 32 ++++++++++++++++++++++++++++++--
 1 file changed, 30 insertions(+), 2 deletions(-)

diff --git a/metrics/binary-size/index.html b/metrics/binary-size/index.html
index 03b9844d94..0574cd3bc4 100644
--- a/metrics/binary-size/index.html
+++ b/metrics/binary-size/index.html
@@ -14,7 +14,7 @@ google.charts.setOnLoadCallback(function() {
         { 'platform': 'Android', 'arch': 'arm-v7' },
         { 'platform': 'Android', 'arch': 'arm-v8' },
         { 'platform': 'Android', 'arch': 'x86' },
-        { 'platform': 'Android', 'arch': 'x86-64' },
+        { 'platform': 'Android', 'arch': 'x86_64' },
         { 'platform': 'Android', 'arch': 'mips' },
     ];
 
@@ -24,6 +24,8 @@ google.charts.setOnLoadCallback(function() {
         data.addColumn('number', item.platform + '/' + item.arch);
     });
 
+    const beginDate = new Date('2016-11-16');
+
     var dateFormatter = new google.visualization.DateFormat({formatType: 'long'});
     var byteFormatter = new google.visualization.NumberFormat({pattern:'###,### bytes'});
 
@@ -33,6 +35,7 @@ google.charts.setOnLoadCallback(function() {
             for (var i = 0; i < json.Datapoints.length; i++) {
                 var item = json.Datapoints[i];
                 var row = [new Date(item.Timestamp)];
+                if (row[0] < beginDate) continue;
                 for (var j = 0; j < platforms.length; j++) {
                     if (j == index) {
                         row.push(item.Maximum);
@@ -57,7 +60,32 @@ google.charts.setOnLoadCallback(function() {
 function drawChart() {
     var options = {
         title: 'Mapbox GL Binary size',
-        chartArea: {height: '90%'},
+        chartArea: { height: '90%', width: '90%' },
+        series: [
+            { color: '#dc464c', targetAxisIndex: 1, pointSize: 2 }, // iOS/armv7
+            { color: '#a01d22', targetAxisIndex: 1, pointSize: 2 }, // iOS/arm64
+
+            { color: '#1a2c41', targetAxisIndex: 1, pointSize: 2 }, // macOS/x86_64
+
+            { color: '#8b87e0', targetAxisIndex: 1, pointSize: 2 }, // Android/arm-v5
+            { color: '#7774c0', targetAxisIndex: 1, pointSize: 2 }, // Android/arm-v7
+            { color: '#5f5c99', targetAxisIndex: 1, pointSize: 2 }, // Android/arm-v7
+
+            { color: '#48ad6e', targetAxisIndex: 1, pointSize: 2 }, // Android/x86
+            { color: '#357f51', targetAxisIndex: 1, pointSize: 2 }, // Android/x86_64
+
+            { color: '#f9a12e', targetAxisIndex: 1, pointSize: 2 }, // Android/mips
+        ],
+        legend: { position: 'in' },
+        pointsVisible: true,
+        vAxis: {
+            ticks: [ 1e6, 1.5e6, 2e6, 2.5e6, 3e6, 3.5e6, 4e6, 4.5e6, 5e6, 5.5e6, 6e6, 6.5e6, 7e6, 7.5e6, 8e6 ],
+            gridlines: { color: '#999' },
+            minorGridlines: { count: 4, color: '#EEE' },
+            textPosition: 'out',
+            format: 'short',
+            viewWindow: { min: 2.5e6, max: 8.0e6 }
+        },
         interpolateNulls: true
     };
 
-- 
cgit v1.2.1