From 12c10fae4c5d18852ea0b6cf457452231b1117ff Mon Sep 17 00:00:00 2001 From: Lucy King Date: Wed, 5 Jun 2024 11:26:37 +0100 Subject: [PATCH 01/13] changes from tues 4th --- .DS_Store | Bin 0 -> 6148 bytes data-for-dataviz-three.csv | 213 - data-for-dataviz-two.csv | 2782 --- dots of billions TestData v2.csv | 9577 ---------- dots of billions TestData.csv | 9577 ---------- package-lock.json | 430 +- package.json | 5 +- public/.DS_Store | Bin 0 -> 6148 bytes public/assets/.DS_Store | Bin 0 -> 6148 bytes public/assets/dataviz-three-final.svg | 1 + public/assets/dataviz-two-final.svg | 1 + .../assets/private-vs-public-widescreen.svg | 126 + public/assets/static-viz-two.svg | 207 + public/css/styles.css | 25 + public/html/index.html | 188 - public/img/.DS_Store | Bin 0 -> 6148 bytes public/img/private-vs-public-mobile.svg | 126 + public/img/private-vs-public-tablet.svg | 126 + public/index.html | 15480 ++++++++++++++++ public/js/dataViz.js | 87 +- public/js/dataViz2.js | 125 +- public/js/dataViz3.js | 2 +- public/js/fade.js | 2 +- public/js/intro.js | 1 + 24 files changed, 16629 insertions(+), 22452 deletions(-) create mode 100644 .DS_Store delete mode 100644 data-for-dataviz-three.csv delete mode 100644 data-for-dataviz-two.csv delete mode 100644 dots of billions TestData v2.csv delete mode 100644 dots of billions TestData.csv create mode 100644 public/.DS_Store create mode 100644 public/assets/.DS_Store create mode 100644 public/assets/dataviz-three-final.svg create mode 100644 public/assets/dataviz-two-final.svg create mode 100644 public/assets/private-vs-public-widescreen.svg create mode 100644 public/assets/static-viz-two.svg delete mode 100644 public/html/index.html create mode 100644 public/img/.DS_Store create mode 100644 public/img/private-vs-public-mobile.svg create mode 100644 public/img/private-vs-public-tablet.svg create mode 100644 public/index.html diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..e9affc4c3611919a7e1884fa5a5cc44b08440407 GIT binary patch literal 6148 zcmeHK&ubGw6n>M&bYm+-PzXX{!D}01TPoru#`NI9OH=fq5_hvny6tu+Wb*?Ift>YU z5xn}B_`i74@6AkQvq^+{5Yc(d%r`&Yd-LXd*_{j#iTWsbNK_&s2Zb?z6V(dgc`i$m zGb6WvLisqSKAdmWZDzy0i@<-t*O69u}75Y62pgly{ zqb^Ar0Ix>I6w-V2hjfPV4xS3NDWP%do4`IlXMC1_dia&k307O_PwZs;x$q|uMM5sH zi`qwI5uOnJSdE_|x&%56vm2Mjw7B^4FN86!5f;dr~~_t0C) zPOg`+--fnCbRBBZrD~0^YwR?W0nX~DR90^z`yN)iK;47>9;~G5t5rFQj0etP+QW9n z!x}r4tF&DKb|d76_uO7wLon}ab^S@wH|NY3zaNFkuv+~pavS*@g-vJE*>c`C&*Y>z z^oFCP?hRgZ?^MdjziNB_%dj(PmF_%~@z4w7&OjN2K?f>tUWIWWCv`cBgGAXj^@LM& zimg(4I^932?z#tuk7m2>^zlC0hX+TqS<$(B|G|@!)= 10" + } + }, "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", @@ -796,6 +807,376 @@ "node": ">= 8" } }, + "node_modules/d3": { + "version": "7.9.0", + "resolved": "https://registry.npmjs.org/d3/-/d3-7.9.0.tgz", + "integrity": "sha512-e1U46jVP+w7Iut8Jt8ri1YsPOvFpg46k+K8TpCb0P+zjCkjkPnV7WzfDJzMHy1LnA+wj5pLT1wjO901gLXeEhA==", + "dependencies": { + "d3-array": "3", + "d3-axis": "3", + "d3-brush": "3", + "d3-chord": "3", + "d3-color": "3", + "d3-contour": "4", + "d3-delaunay": "6", + "d3-dispatch": "3", + "d3-drag": "3", + "d3-dsv": "3", + "d3-ease": "3", + "d3-fetch": "3", + "d3-force": "3", + "d3-format": "3", + "d3-geo": "3", + "d3-hierarchy": "3", + "d3-interpolate": "3", + "d3-path": "3", + "d3-polygon": "3", + "d3-quadtree": "3", + "d3-random": "3", + "d3-scale": "4", + "d3-scale-chromatic": "3", + "d3-selection": "3", + "d3-shape": "3", + "d3-time": "3", + "d3-time-format": "4", + "d3-timer": "3", + "d3-transition": "3", + "d3-zoom": "3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-array": { + "version": "3.2.4", + "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-3.2.4.tgz", + "integrity": "sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==", + "dependencies": { + "internmap": "1 - 2" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-axis": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/d3-axis/-/d3-axis-3.0.0.tgz", + "integrity": "sha512-IH5tgjV4jE/GhHkRV0HiVYPDtvfjHQlQfJHs0usq7M30XcSBvOotpmH1IgkcXsO/5gEQZD43B//fc7SRT5S+xw==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-brush": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/d3-brush/-/d3-brush-3.0.0.tgz", + "integrity": "sha512-ALnjWlVYkXsVIGlOsuWH1+3udkYFI48Ljihfnh8FZPF2QS9o+PzGLBslO0PjzVoHLZ2KCVgAM8NVkXPJB2aNnQ==", + "dependencies": { + "d3-dispatch": "1 - 3", + "d3-drag": "2 - 3", + "d3-interpolate": "1 - 3", + "d3-selection": "3", + "d3-transition": "3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-chord": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-chord/-/d3-chord-3.0.1.tgz", + "integrity": "sha512-VE5S6TNa+j8msksl7HwjxMHDM2yNK3XCkusIlpX5kwauBfXuyLAtNg9jCp/iHH61tgI4sb6R/EIMWCqEIdjT/g==", + "dependencies": { + "d3-path": "1 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-color": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz", + "integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-contour": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/d3-contour/-/d3-contour-4.0.2.tgz", + "integrity": "sha512-4EzFTRIikzs47RGmdxbeUvLWtGedDUNkTcmzoeyg4sP/dvCexO47AaQL7VKy/gul85TOxw+IBgA8US2xwbToNA==", + "dependencies": { + "d3-array": "^3.2.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-delaunay": { + "version": "6.0.4", + "resolved": "https://registry.npmjs.org/d3-delaunay/-/d3-delaunay-6.0.4.tgz", + "integrity": "sha512-mdjtIZ1XLAM8bm/hx3WwjfHt6Sggek7qH043O8KEjDXN40xi3vx/6pYSVTwLjEgiXQTbvaouWKynLBiUZ6SK6A==", + "dependencies": { + "delaunator": "5" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-dispatch": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-3.0.1.tgz", + "integrity": "sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-drag": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-3.0.0.tgz", + "integrity": "sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==", + "dependencies": { + "d3-dispatch": "1 - 3", + "d3-selection": "3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-dsv": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-dsv/-/d3-dsv-3.0.1.tgz", + "integrity": "sha512-UG6OvdI5afDIFP9w4G0mNq50dSOsXHJaRE8arAS5o9ApWnIElp8GZw1Dun8vP8OyHOZ/QJUKUJwxiiCCnUwm+Q==", + "dependencies": { + "commander": "7", + "iconv-lite": "0.6", + "rw": "1" + }, + "bin": { + "csv2json": "bin/dsv2json.js", + "csv2tsv": "bin/dsv2dsv.js", + "dsv2dsv": "bin/dsv2dsv.js", + "dsv2json": "bin/dsv2json.js", + "json2csv": "bin/json2dsv.js", + "json2dsv": "bin/json2dsv.js", + "json2tsv": "bin/json2dsv.js", + "tsv2csv": "bin/dsv2dsv.js", + "tsv2json": "bin/dsv2json.js" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-ease": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz", + "integrity": "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-fetch": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-fetch/-/d3-fetch-3.0.1.tgz", + "integrity": "sha512-kpkQIM20n3oLVBKGg6oHrUchHM3xODkTzjMoj7aWQFq5QEM+R6E4WkzT5+tojDY7yjez8KgCBRoj4aEr99Fdqw==", + "dependencies": { + "d3-dsv": "1 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-force": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/d3-force/-/d3-force-3.0.0.tgz", + "integrity": "sha512-zxV/SsA+U4yte8051P4ECydjD/S+qeYtnaIyAs9tgHCqfguma/aAQDjo85A9Z6EKhBirHRJHXIgJUlffT4wdLg==", + "dependencies": { + "d3-dispatch": "1 - 3", + "d3-quadtree": "1 - 3", + "d3-timer": "1 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-format": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-3.1.0.tgz", + "integrity": "sha512-YyUI6AEuY/Wpt8KWLgZHsIU86atmikuoOmCfommt0LYHiQSPjvX2AcFc38PX0CBpr2RCyZhjex+NS/LPOv6YqA==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-geo": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/d3-geo/-/d3-geo-3.1.1.tgz", + "integrity": "sha512-637ln3gXKXOwhalDzinUgY83KzNWZRKbYubaG+fGVuc/dxO64RRljtCTnf5ecMyE1RIdtqpkVcq0IbtU2S8j2Q==", + "dependencies": { + "d3-array": "2.5.0 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-hierarchy": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/d3-hierarchy/-/d3-hierarchy-3.1.2.tgz", + "integrity": "sha512-FX/9frcub54beBdugHjDCdikxThEqjnR93Qt7PvQTOHxyiNCAlvMrHhclk3cD5VeAaq9fxmfRp+CnWw9rEMBuA==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-interpolate": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz", + "integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==", + "dependencies": { + "d3-color": "1 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-path": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-3.1.0.tgz", + "integrity": "sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-polygon": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-polygon/-/d3-polygon-3.0.1.tgz", + "integrity": "sha512-3vbA7vXYwfe1SYhED++fPUQlWSYTTGmFmQiany/gdbiWgU/iEyQzyymwL9SkJjFFuCS4902BSzewVGsHHmHtXg==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-quadtree": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-quadtree/-/d3-quadtree-3.0.1.tgz", + "integrity": "sha512-04xDrxQTDTCFwP5H6hRhsRcb9xxv2RzkcsygFzmkSIOJy3PeRJP7sNk3VRIbKXcog561P9oU0/rVH6vDROAgUw==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-random": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-random/-/d3-random-3.0.1.tgz", + "integrity": "sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-scale": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-4.0.2.tgz", + "integrity": "sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==", + "dependencies": { + "d3-array": "2.10.0 - 3", + "d3-format": "1 - 3", + "d3-interpolate": "1.2.0 - 3", + "d3-time": "2.1.1 - 3", + "d3-time-format": "2 - 4" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-scale-chromatic": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/d3-scale-chromatic/-/d3-scale-chromatic-3.1.0.tgz", + "integrity": "sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==", + "dependencies": { + "d3-color": "1 - 3", + "d3-interpolate": "1 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-selection": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz", + "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-shape": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-3.2.0.tgz", + "integrity": "sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==", + "dependencies": { + "d3-path": "^3.1.0" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-time": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-3.1.0.tgz", + "integrity": "sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==", + "dependencies": { + "d3-array": "2 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-time-format": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-4.1.0.tgz", + "integrity": "sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==", + "dependencies": { + "d3-time": "1 - 3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-timer": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz", + "integrity": "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==", + "engines": { + "node": ">=12" + } + }, + "node_modules/d3-transition": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-3.0.1.tgz", + "integrity": "sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==", + "dependencies": { + "d3-color": "1 - 3", + "d3-dispatch": "1 - 3", + "d3-ease": "1 - 3", + "d3-interpolate": "1 - 3", + "d3-timer": "1 - 3" + }, + "engines": { + "node": ">=12" + }, + "peerDependencies": { + "d3-selection": "2 - 3" + } + }, + "node_modules/d3-zoom": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-3.0.0.tgz", + "integrity": "sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==", + "dependencies": { + "d3-dispatch": "1 - 3", + "d3-drag": "2 - 3", + "d3-interpolate": "1 - 3", + "d3-selection": "2 - 3", + "d3-transition": "2 - 3" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/debug": { "version": "2.6.9", "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", @@ -829,6 +1210,14 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/delaunator": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/delaunator/-/delaunator-5.0.1.tgz", + "integrity": "sha512-8nvh+XBe96aCESrGOqMp/84b13H9cdKbG5P2ejQCh4d4sK9RL4371qou9drQjMhvnPmhWl5hnmqbEE0fXr9Xnw==", + "dependencies": { + "robust-predicates": "^3.0.2" + } + }, "node_modules/depd": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz", @@ -1767,6 +2156,17 @@ "node": ">=8.0.0" } }, + "node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/ignore": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz", @@ -1827,6 +2227,19 @@ "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", "license": "ISC" }, + "node_modules/internmap": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz", + "integrity": "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==", + "engines": { + "node": ">=12" + } + }, + "node_modules/intersection-observer": { + "version": "0.12.2", + "resolved": "https://registry.npmjs.org/intersection-observer/-/intersection-observer-0.12.2.tgz", + "integrity": "sha512-7m1vEcPCxXYI8HqnL8CKI6siDyD+eIWSwgB3DZA+ZTogxk9I4CDnj4wilt9x/+/QbHI4YG5YZNmC6458/e9Ktg==" + }, "node_modules/ipaddr.js": { "version": "1.9.1", "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz", @@ -2613,6 +3026,11 @@ "node": ">=0.10.0" } }, + "node_modules/robust-predicates": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-3.0.2.tgz", + "integrity": "sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==" + }, "node_modules/run-parallel": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", @@ -2637,6 +3055,11 @@ "queue-microtask": "^1.2.2" } }, + "node_modules/rw": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz", + "integrity": "sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==" + }, "node_modules/rx": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz", @@ -2670,6 +3093,11 @@ "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", "license": "MIT" }, + "node_modules/scrollama": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/scrollama/-/scrollama-3.2.0.tgz", + "integrity": "sha512-PIPwB1kYBnbw/ezvPBJa5dCN5qEwokfpAkI3BmpZWAwcVID4nDf1qH6WV16A2fQaJmsKx0un5S/zhxN+PQeKDQ==" + }, "node_modules/semver": { "version": "7.6.2", "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz", diff --git a/package.json b/package.json index 0944115..9192cb0 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,9 @@ "prettier": "^3.2.5" }, "dependencies": { - "express": "^4.19.2" + "d3": "^7.9.0", + "express": "^4.19.2", + "intersection-observer": "^0.12.2", + "scrollama": "^3.2.0" } } diff --git a/public/.DS_Store b/public/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..d428380945d29add53c4518a3b493c19894d9d93 GIT binary patch literal 6148 zcmeHK&5qMB5FWRs>#{=X0i-=f;<|$Fj}{>=*={*-B?u0HO43x_KoVC?N)J_~oZ$hG zkaz~JoH+6boOlpKg7eiKF%duEm?>SHY` zfea?+qTXTD=Z(HNDq0j%SuvlYX_^#eulH3onyoACExo0;_4DA=EP^sD=S4r9J*Ch*On%Ttq2uqXPu2E05!JBq&U>>Og%iDSSq zaLE~v-Ar#^avt399RrSmIs>#nc&LQFU}cfF4lMWzfY?Ge3)=KUNI9OMFIZW`78GSu z5pAlHD~7V^==UVf7pyGWbWn2nQ1WIaHx$Kh$NoJI2jyFIrDMP`u*pEvR=afm-@o|& zznSD}jseHOf5m`m4T3=*ha_ifZE$qfdZ;f@Nhq$e_%j6!K8i7xj^Z6u7W8{$Ao_xp SMf9M!9|5Mp6^?H1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3 zem<@ulZcFPQ@L2!n>{z**++&mCkOWA81W14cNZlEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ zLs35+`xjp>T0 \ No newline at end of file diff --git a/public/assets/dataviz-two-final.svg b/public/assets/dataviz-two-final.svg new file mode 100644 index 0000000..bfc3827 --- /dev/null +++ b/public/assets/dataviz-two-final.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/assets/private-vs-public-widescreen.svg b/public/assets/private-vs-public-widescreen.svg new file mode 100644 index 0000000..256478c --- /dev/null +++ b/public/assets/private-vs-public-widescreen.svg @@ -0,0 +1,126 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/public/assets/static-viz-two.svg b/public/assets/static-viz-two.svg new file mode 100644 index 0000000..66c1e52 --- /dev/null +++ b/public/assets/static-viz-two.svg @@ -0,0 +1,207 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/public/css/styles.css b/public/css/styles.css index de2241a..b620399 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -192,4 +192,29 @@ div > p { margin-left: 110px; top: 60%; } + + #dataviz-two-sizing { + width: max-content; + } + + .dataviz_three_spacing { + margin-top: 5000px; + } + + .para-text { + margin: 0px; + padding: 0px; + } + + #Layer_1 { + max-width: 800px; + max-height: 800px; + display: block; + margin: auto; + } + + #layer_2 { + display: block; + margin: auto; + } } diff --git a/public/html/index.html b/public/html/index.html deleted file mode 100644 index 792ddf0..0000000 --- a/public/html/index.html +++ /dev/null @@ -1,188 +0,0 @@ - - - - - - - Billionaire Tax Evasion - - - - - - - - - - - - - - - - - -
-

WHERE TO FIND$200 BILLION

-
-
-
-
-
-
-
-
-
-
-
-
-

It's down here

- -
-
- - -
-
-
-

- Most would like to be a little wealthier. Some want to be the wealthiest. -

-

- 2781 people in the World have reached the financial summit: The Billionaires. -

-

- They each have a private wealth of at least 1,000,000,000: 9 zeros. -

-
-
-

- This minute portion of the population has captured an outsized amount of total global wealth. -

-
-
-

- Here's what that looks like. This represents who owns all of the World's wealth. -

- -
- -
-

- The poorest half of the World contains approximately 4 billion people. Together they share 2% of all the - wealth in the World. -

-
- -
-

- Less than 3000 Billionaires own three times that. -

-

- The gap between the poorest and the richest has been growing bigger -

-

- and bigger -

-

- for the last four decades. -

-
-
-
-

- In the 1980s, Thatcher and Reagan championed a radical new idea: Individuals should be free to pursue wealth - and governments should get out of the way. Their ideas inspired the World. Countries vied to attract big - businesses and the wealthy by dismantling regulations and enabling wealth to flow across borders. -

- Businesses thrived. But another transformation was happening too: The World’s wealth was concentrating - in the hands of the few. In richer countries, we have reached an extreme: the totality of wealth is now in - private hands. -

-

- In the UK, Public Wealth has dropped from 102% of national income in 1980 to -106% in 2020. One of the - fundamental mechanisms for addressing this ever-widening gap between rich and poor is the - progressive tax system, where individuals contribute in accordance with their earnings. For a long time, the - amount Billionaires pay in taxes have been shrouded in mystery. Until now. Recent - studies have gathered just enough data to start painting a clearer picture. The findings reveal a stark - truth: -

-

Billionaires are paying significantly less tax than anyone else. -

-

This represents how much each income group pays in taxes. This group are the majority: The bottom 90% of - earners. When you average out across the three countries - studied, they’re all paying around the same percentage, 36%. This group are the Billionaires. This time - they’re the smallest dot: Because they’re paying - the least tax. As a percentage of income, it works out to be about 25%. But that figure is hiding a crucial - detail: Billionaires tend to keep their tax-vulnerable incomes low. Instead, the majority of their wealth - sits in things like dividends or assets and they borrow against those assets. Take Elon Musk for example, who - earned no salary in 2023 and borrowed the $13 billion to buy Twitter from interest free loans off the back of - his - wealth portfolio. -

-

If you take their tax rate as a percentage of their wealth, it’s close to 0%. -

-

- In the dance of wealth and taxation, the savvy wealthy individual has long mastered the art of sidestepping - high - tax rates, often without straying into the realm of outright evasion. -

-

- Since the 80s, countries have competed to attract Billionaires and multinational companies by effectively - facilitating this tax dodge: As a result, the average corporation income tax rate fell by half in the space of - three decades. The rich have grown exponentially richer, faster than anyone else, leading us to crash land - where - we are now: a Topsy Turvy World where the wealthiest pay the lowest effective tax rate. -

-

- The EU Tax Observatory, a Research Institute run out of the Paris School of Economics, argue that this reality - is not inevitable. They propose a bold solution: The total global tax paid by a billionaire should not fall - below 2% of their wealth. Put simply: If Bloombery or Forbes can figure out how much someone is worth, so - should - the taxman. -

-

- Global cooperation may seem like a pipe dream. After all, wealthy individuals offer huge benefits to countries - who make them feel welcome. But recent history can inspire: In 2021, 140 countries agreed on a minimum 15% tax - rate for multinational corporations. The rule has holes and snags, but it’s progress. Another leap forward has - been the automatic exchange of banking information since 2017, which led to a two-thirds reduction in offshore - tax evasion within a decade. -

-

- The possibility of international cooperation is real, but it’s also possible for countries to make - significant progress alone: Only Thirty counties host more than 10 billionaires. Any of those countries could - decide to enforce a minimum tax on wealthy long-term residents, preventing them from amassing fortunes - domestically only to relocate their wealth abroad. -

-
-
-

Let’s get back to this dot. Many in the Billionaires Club have vastly more than just a billion - dollars. It’s pretty hard to imagine how much money that is, so let’s make this dot represent one - billion dollars. -

-
-
-

This is how many billion dollars the World’s Billionaires collectively have. -

-

Click on the dot to find out who owns it. -

- -
-
-

So where can you find $200 billion? -

-

Right here. It is hiding in plain sight. -

-

If a 2% minimum tax on billionaires is introduced, we would raise $214 billion from less than 3000 - individuals. -

-
-
-
- - - - - - \ No newline at end of file diff --git a/public/img/.DS_Store b/public/img/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..11ebbfdf13dbd2ac192c9dac5e963eb23c6351ec GIT binary patch literal 6148 zcmeHKyG{c!5FA5_NHi%aDEtG7#2=U_6x93xTsWafhc1F7_5Bf_2s2)TIB+U$KW@*V?z3%g; zy1BSF&VV!E3^)VMzz-SVnJt-~7<%grI0MeWI|JGuB2}0Q4u*N_V594^;uE2Swywg$ zSTGeF3>l#WOC?%rC{K)F>Ga1kE)^UMEgd1x%sOS}x5rD!v(q2*aD-&&tux>Zj2Sq# z?o8+ZC4ZUfBY&LYJ!ilf_-71+$?AHw28H(M62Ol3k<%Qs bc$Cd?so-F!D)Q%aqF)3uA>KFxzresNjLSAm literal 0 HcmV?d00001 diff --git a/public/img/private-vs-public-mobile.svg b/public/img/private-vs-public-mobile.svg new file mode 100644 index 0000000..fe24969 --- /dev/null +++ b/public/img/private-vs-public-mobile.svg @@ -0,0 +1,126 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/public/img/private-vs-public-tablet.svg b/public/img/private-vs-public-tablet.svg new file mode 100644 index 0000000..5e37705 --- /dev/null +++ b/public/img/private-vs-public-tablet.svg @@ -0,0 +1,126 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..89222d1 --- /dev/null +++ b/public/index.html @@ -0,0 +1,15480 @@ + + + + + + + Billionaire Tax Evasion + + + + + + + + + + + + + + + + + +
+

WHERE TO FIND$200 BILLION

+
+
+
+
+
+
+
+
+
+
+
+
+

It's down here

+ +
+
+ + +
+
+
+

+ Most would like to be a little wealthier. Some want to be the wealthiest. +

+

+ 2781 people in the World have reached the financial summit: The Billionaires. +

+

+ They each have a private wealth of at least 1,000,000,000: 9 zeros. +

+

+ This minute portion of the population has captured an outsized amount of total global wealth. +

+
+
+
+
+

+ Here's what that looks like. This represents who owns all of the World's wealth. +

+

+ The poorest half of the World share 2% of all the wealth in the World. The top 10% have captured 78%. +

+ +
+ +
+

+ And then there's the Billionaires. Less than 3000 individuals have three times as much wealth as half of the + World's population. +

+

+ The gap between the poorest and the richest has been growing bigger +

+

+ and bigger +

+

+ for the last four decades. +

+
+
+
+

+ In the 1980s, Thatcher and Reagan championed a radical new idea: Individuals should be free to pursue wealth + and governments should get out of the way. Their ideas inspired the World. Countries vied to attract big + businesses and the wealthy by dismantling regulations and enabling wealth to flow across borders. +

+ Businesses thrived. But another transformation was happening too: The World’s wealth was concentrating + in the hands of the few. In richer countries, we have reached an extreme: the totality of wealth is now in + private hands. +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

+ In the UK, Public Wealth has dropped from 102% of national income in 1980 to -106% in 2020. One of the + fundamental mechanisms for addressing this ever-widening gap between rich and poor is the + progressive tax system, where individuals contribute in accordance with their earnings. For a long time, the + amount Billionaires pay in taxes have been shrouded in mystery. Until now. Recent + studies have gathered just enough data to start painting a clearer picture. The findings reveal a stark + truth: +

+

Billionaires are paying significantly less tax than anyone else. +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

This represents how much each income group pays in taxes. This group are the majority: The bottom 90% of + earners. When you average out across the three countries + studied, they’re all paying around the same percentage, 36%. This group are the Billionaires. This time + they’re the smallest dot: Because they’re paying + the least tax. As a percentage of income, it works out to be about 25%. But that figure is hiding a crucial + detail: Billionaires tend to keep their tax-vulnerable incomes low. Instead, the majority of their wealth + sits in things like dividends or assets and they borrow against those assets. Take Elon Musk for example, who + earned no salary in 2023 and borrowed the $13 billion to buy Twitter from interest free loans off the back of + his + wealth portfolio. +

+

If you take their tax rate as a percentage of their wealth, it’s close to 0%. +

+

+ In the dance of wealth and taxation, the savvy wealthy individual has long mastered the art of sidestepping + high + tax rates, often without straying into the realm of outright evasion. +

+

+ Since the 80s, countries have competed to attract Billionaires and multinational companies by effectively + facilitating this tax dodge: As a result, the average corporation income tax rate fell by half in the space of + three decades. The rich have grown exponentially richer, faster than anyone else, leading us to crash land + where + we are now: a Topsy Turvy World where the wealthiest pay the lowest effective tax rate. +

+

+ The EU Tax Observatory, a Research Institute run out of the Paris School of Economics, argue that this reality + is not inevitable. They propose a bold solution: The total global tax paid by a billionaire should not fall + below 2% of their wealth. Put simply: If Bloombery or Forbes can figure out how much someone is worth, so + should + the taxman. +

+

+ Global cooperation may seem like a pipe dream. After all, wealthy individuals offer huge benefits to countries + who make them feel welcome. But recent history can inspire: In 2021, 140 countries agreed on a minimum 15% tax + rate for multinational corporations. The rule has holes and snags, but it’s progress. Another leap forward has + been the automatic exchange of banking information since 2017, which led to a two-thirds reduction in offshore + tax evasion within a decade. +

+

+ The possibility of international cooperation is real, but it’s also possible for countries to make + significant progress alone: Only Thirty counties host more than 10 billionaires. Any of those countries could + decide to enforce a minimum tax on wealthy long-term residents, preventing them from amassing fortunes + domestically only to relocate their wealth abroad. +

+

So let's get back to our Dots.

+

It's hard to comprehend how much wealth the Billionaires collectively have. So let's imagine + this + dot represents a Billion dollars. It's a Billion dollar dot.

+ + + + + +

This is how many billion dollars the 2781 Billionaires have.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

So where can you find $200 billion? +

+

Right here. It is hiding in plain sight. +

+

If a 2% minimum tax on billionaires is introduced, we would raise $214 billion from less than 3000 + individuals. +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + + + + \ No newline at end of file diff --git a/public/js/dataViz.js b/public/js/dataViz.js index 772d7c9..03b6eb5 100644 --- a/public/js/dataViz.js +++ b/public/js/dataViz.js @@ -9,10 +9,10 @@ const colours = [ "#0E8BCD", "#003D2B", "#E1B52F", - "#CB026E", "#919191", "#5B8F77", "#01608A", + "#CB026E", "#D86C01", "#8B3076", ]; @@ -123,9 +123,9 @@ export function revertChangeSize() { // STEP THREE FUNCTIONS export function hideDataPoints() { - // Hide all circles except the one at index 0 + // Hide all circles except the ones at index 0 and 6 circles.each(function (d, i) { - if (i !== 0) { + if (i !== 0 && i !== 6) { d3.select(this) .transition() .duration(3000) @@ -137,9 +137,10 @@ export function hideDataPoints() { hideLines(); hideText(); } + export function moveBlueCircle() { // Updates width so blue circle is in the middle of the page - x.range([width / 2 - initialRadius, width]); + x.range([width / 4, (width * 3) / 4]); // Moves blue circle and makes it correct radius circles @@ -147,32 +148,88 @@ export function moveBlueCircle() { .transition() .duration(3000) .delay((_, i) => i * 750) - .attr("cx", (_, i) => x(i)) - .attr("cy", (d) => startHeight - radiusScale(d)) - .attr("r", (d) => radiusScale(d)); + .attr("cx", (_, i) => x(0)) + .attr("cy", (d) => startHeight - radiusScale(d) * 1.5) + .attr("r", (d) => radiusScale(d) * 1.5); + + // Moves circle with value 6.4 and makes it correct radius + circles + .filter((_, i) => i === 6) + .transition() + .duration(3000) + .delay((_, i) => i * 750) + .attr("cx", (_, i) => x(1)) + .attr("cy", (d) => startHeight - radiusScale(d) * 1.5) + .attr("r", (d) => radiusScale(d) * 1.5); // Add blue circle line and text - const cx = x(0); - const colour = colours[0]; + const cx1 = x(0); + const colour1 = colours[0]; svg .append("line") - .attr("x1", cx) + .attr("x1", cx1) .attr("y1", startHeight) - .attr("x2", cx) + .attr("x2", cx1) .attr("y2", startHeight + lineLength) - .attr("stroke", colour) + .attr("stroke", colour1) .attr("stroke-opacity", 0.5) .attr("stroke-width", 1) .attr("class", "data-line"); svg .append("text") - .attr("x", cx) + .attr("x", cx1) .attr("y", startHeight + lineLength + 15) - .attr("fill", colour) + .attr("fill", colour1) .attr("fill-opacity", 0.5) .attr("text-anchor", "middle") - .text(labels[1]) + .text(labels[0]) .attr("class", "data-text"); + + // Add circle line and text for value 6.4 + const cx2 = x(1); + const colour2 = colours[6]; + svg + .append("line") + .attr("x1", cx2) + .attr("y1", startHeight) + .attr("x2", cx2) + .attr("y2", startHeight + lineLength) + .attr("stroke", colour2) + .attr("stroke-opacity", 0.5) + .attr("stroke-width", 1) + .attr("class", "data-line"); + svg + .append("text") + .attr("x", cx2) + .attr("y", startHeight + lineLength + 15) + .attr("fill", colour2) + .attr("fill-opacity", 0.5) + .attr("text-anchor", "middle") + .text(labels[6]) + .attr("class", "data-text"); +} + +export function growCircles() { + circles + .filter((_, i) => i === 0 || i === 6) + .transition() + .duration(3000) + .attr("cy", (d) => startHeight - radiusScale(d) * 3) + .attr("r", (d) => radiusScale(d) * 3); + + // Move the lines and text accordingly + svg + .selectAll(".data-line") + .transition() + .duration(3000) + .attr("y1", startHeight) + .attr("y2", startHeight + lineLength * 2); + + svg + .selectAll(".data-text") + .transition() + .duration(3000) + .attr("y", startHeight + lineLength * 2 + 15); } function hideLines() { diff --git a/public/js/dataViz2.js b/public/js/dataViz2.js index acee6ee..b94dee1 100644 --- a/public/js/dataViz2.js +++ b/public/js/dataViz2.js @@ -1,9 +1,6 @@ /* Importing D3*/ import * as d3 from "https://cdn.jsdelivr.net/npm/d3@7/+esm"; -// Set the dimensions and margins of the graph -const width = window.innerWidth; -const height = 1000; //3000; let hasDataVizStarted = false; let svg; export function stopDataViz2() { @@ -14,29 +11,15 @@ export function startDataViz2() { if (!hasDataVizStarted) { hasDataVizStarted = true; // Append the SVG object to the body of the page - svg = d3 - .select("#dataviz_two") - .append("svg") - .attr("width", width) - .attr("height", height); + svg = d3.select("#dataviz_two").append("svg"); + // Read data d3.csv( - "https://raw.githubusercontent.com/fac31/Lucy-Jack-Final/main/data-for-dataviz-two.csv", + "https://raw.githubusercontent.com/fac31/Lucy-Jack-Final/main/data-for-dataviz-two-v2.csv", ) .then(function (data) { console.log("Data loaded"); - // Preprocess data to create circles based on 'number-of-dots' - let processedData = []; - data.forEach((d) => { - for (let i = 0; i < +d["number-of-dots"]; i++) { - processedData.push({ - name: d.name, - netWorth: d["net-worth"], - }); - } - }); - // Create a tooltip var Tooltip = d3 .select("#dataviz_two") @@ -48,7 +31,7 @@ export function startDataViz2() { .style("border-width", "2px") .style("border-radius", "5px") .style("padding", "5px") - .style("position", "absolute"); // Ensure the tooltip is positioned absolutely + .style("position", "absolute"); // Three functions that change the tooltip when user hover / move / leave a cell var mouseover = () => { @@ -57,7 +40,7 @@ export function startDataViz2() { var mousemove = function (event, d) { Tooltip.html( - `This Billion Dollar Dot is owned by ${d.name}. Their total wealth is estimated to be ${d.netWorth}`, + `This Billion Dollar Dot is owned by ${d.name}. Their total wealth is estimated to be ${d["net-worth"]}`, ) .style("left", event.pageX + 20 + "px") .style("top", event.pageY + "px") @@ -68,84 +51,34 @@ export function startDataViz2() { Tooltip.style("opacity", 0); }; - // Initialize the first large circle - var node = svg + // Append circles for each data point + var circles = svg + .selectAll(".node") + .data(data) + .enter() .append("circle") .attr("class", "node") - .attr("r", 95) // Start with radius 95px - .attr("cx", width / 2) - .attr("cy", height / 2) + .attr("r", 1) // Small circles radius + .attr("cx", (d, i) => i * 1) // Position circles horizontally + .attr("cy", (d, i) => i * 1) // Position circles vertically .style("fill", "#0E8BCD") .style("fill-opacity", 0.5) - .style("stroke-width", 1); - - // Function to transition the large circle to a small circle, then fade out - function shrinkAndFadeOutCircle() { - console.log("Shrinking and fading out circle..."); - node - .transition() - .duration(1000) - .attr("r", 4) // Shrink to radius 4px - .transition() - .duration(1000) - .style("opacity", 0) // Fade out - .on("end", function () { - node.remove(); // Remove the initial circle - fadeInVisualization(); // Fade in the entire visualization - }); - } - - // Function to fade in the entire visualization - function fadeInVisualization() { - console.log("Fading in the entire visualization..."); - - // Apply forces for random-like arrangement - var simulation = d3 - .forceSimulation(processedData) - .force("center", d3.forceCenter(width / 2, height / 2)) - .force("charge", d3.forceManyBody().strength(0.05)) // Adjust charge strength for less space - .force( - "collide", - d3 - .forceCollide() - .radius(0 + 0.5) - .iterations(1), - ); // Adjust collision radius for less space - - // Append circles with initial opacity of 0 - var circles = svg - .selectAll(".node") - .data(processedData) - .enter() - .append("circle") - .attr("class", "node") - .attr("r", 3) // Small circles radius - .attr("cx", width / 2) - .attr("cy", height / 2) - .style("fill", "#0E8BCD") - .style("fill-opacity", 0) - .style("stroke-width", 1) - .on("mouseover", mouseover) - .on("mousemove", mousemove) - .on("mouseleave", mouseleave); - - // Start the simulation - simulation.nodes(processedData).on("tick", function () { - circles - .attr("cx", function (d) { - return d.x; - }) - .attr("cy", function (d) { - return d.y; - }); - }); - - // Fade in the circles - circles.transition().duration(1000).style("fill-opacity", 0.5); - } - - // Start the process by shrinking and fading out the initial large circle - shrinkAndFadeOutCircle(); + .style("stroke-width", 1) + .on("mouseover", mouseover) + .on("mousemove", mousemove) + .on("mouseleave", mouseleave); + + // Calculate the bounding box of the circles + var bbox = svg.node().getBBox(); + + // Set the SVG dimensions based on the bounding box + svg + .attr("width", bbox.width + 40) // Add some padding + .attr("height", bbox.height + 40) + .attr( + "viewBox", + `${bbox.x - 20} ${bbox.y - 20} ${bbox.width + 40} ${bbox.height + 40}`, + ); }) .catch(function (error) { console.error("Error loading or parsing data:", error); diff --git a/public/js/dataViz3.js b/public/js/dataViz3.js index 1ccdbf0..ed6931d 100644 --- a/public/js/dataViz3.js +++ b/public/js/dataViz3.js @@ -25,7 +25,7 @@ export function startDataViz3() { "https://raw.githubusercontent.com/fac31/Lucy-Jack-Final/main/data-for-dataviz-three.csv", ) .then(function (data) { - console.log("Data loaded:", data); + console.log("Data loaded"); // Create a tooltip var Tooltip = d3 diff --git a/public/js/fade.js b/public/js/fade.js index 2bd5d9b..5ddd23c 100644 --- a/public/js/fade.js +++ b/public/js/fade.js @@ -25,7 +25,7 @@ export function fadeIn(element, delay, maxOpacity) { } export function fadeOutSVG(svg, delay) { - svg.setAttribute("opacity", "1"); + svg.setAttribute("opacity", "0.5"); let opacity = parseFloat(svg.getAttribute("opacity")); let timer = setInterval(function () { if (opacity > 0) { diff --git a/public/js/intro.js b/public/js/intro.js index fb2c14c..ba99647 100644 --- a/public/js/intro.js +++ b/public/js/intro.js @@ -36,6 +36,7 @@ function startIntro() { circle.style.marginTop = circleMargin + "px"; } else { clearInterval(timer); + setTimeout(() => fadeOut(circle, 20), 1000); // The console is saying fadeout is not defined - needs fixing } }, 10); }, 2000); From 0e2c375c13e33e9a8b12de908416d4398b452065 Mon Sep 17 00:00:00 2001 From: Lucy King Date: Wed, 5 Jun 2024 13:15:50 +0100 Subject: [PATCH 02/13] adding labels to the end visualizations --- public/css/styles.css | 5 ++ public/index.html | 14 ++--- public/js/labelsfordots.js | 110 +++++++++++++++++++++++++++++++++++++ 3 files changed, 121 insertions(+), 8 deletions(-) create mode 100644 public/js/labelsfordots.js diff --git a/public/css/styles.css b/public/css/styles.css index b620399..bdb3539 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -217,4 +217,9 @@ div > p { display: block; margin: auto; } + + #billion-dollar-dot { + margin: 5px; + padding: 5px; + } } diff --git a/public/index.html b/public/index.html index 89222d1..132bac8 100644 --- a/public/index.html +++ b/public/index.html @@ -9,6 +9,7 @@ + @@ -931,15 +932,12 @@

It's down here

It's hard to comprehend how much wealth the Billionaires collectively have. So let's imagine this dot represents a Billion dollars. It's a Billion dollar dot.

- - - - + +

This is how many billion dollars the 2781 Billionaires have.

- + @@ -15250,10 +15248,10 @@

It's down here

Right here. It is hiding in plain sight.

If a 2% minimum tax on billionaires is introduced, we would raise $214 billion from less than 3000 - individuals. + individuals. Hover over the dot to find out which part of the World could claim that billion dollars.

- + diff --git a/public/js/labelsfordots.js b/public/js/labelsfordots.js new file mode 100644 index 0000000..45ec6b6 --- /dev/null +++ b/public/js/labelsfordots.js @@ -0,0 +1,110 @@ +/* Importing D3*/ +import * as d3 from "https://cdn.jsdelivr.net/npm/d3@7/+esm"; + +/* LABEL FOR THE FIRST DOT */ +const data1 = [ + { x: "100", y: "100", label: "This dot is worth a Billion Dollars" }, +]; + +const svg1 = d3.select("#billion-dollar-dot"); +const circles1 = svg1.selectAll("circle"); + +circles1.data(data1); + +// Create a tooltip element +const tooltip1 = d3 + .select("body") + .append("div") + .attr("class", "tooltip") + .style("opacity", 0) + .style("position", "absolute") + .style("background-color", "white") + .style("border", "solid") + .style("border-width", "1px") + .style("border-radius", "5px") + .style("padding", "5px"); + +// Show tooltip on hover +circles1 + .on("mouseover", function (event, d) { + tooltip1.transition().duration(200).style("opacity", 0.9); + tooltip1 + .html(d.label) + .style("left", event.pageX + "px") + .style("top", event.pageY - 28 + "px"); + }) + .on("mouseout", function (d) { + tooltip1.transition().duration(500).style("opacity", 0); + }); + +/* LABELS FOR THE LARGE VIZ */ +d3.csv( + "https://raw.githubusercontent.com/fac31/Lucy-Jack-Final/main/data-for-dataviz-two-v2.csv", +).then(function (data2) { + const svg2 = d3.select("#billions-of-dots"); + const circles2 = svg2.selectAll("circle"); + + circles2.data(data2); + + // Create a tooltip element + const tooltip = d3 + .select("body") + .append("div") + .attr("class", "tooltip") + .style("opacity", 0) + .style("position", "absolute") + .style("background-color", "white") + .style("border", "solid") + .style("border-width", "1px") + .style("border-radius", "5px") + .style("padding", "5px"); + + // Show tooltip on hover + circles2 + .on("mouseover", function (event, d) { + tooltip.transition().duration(200).style("opacity", 0.9); + tooltip + .html(`This Billion Dollars belongs to ${d.name}`) + .style("left", event.pageX + "px") + .style("top", event.pageY - 28 + "px"); + }) + .on("mouseout", function (d) { + tooltip.transition().duration(500).style("opacity", 0); + }); +}); + +/* LABELS FOR THE LAST VIZ */ +d3.csv( + "https://raw.githubusercontent.com/fac31/Lucy-Jack-Final/main/data-for-dataviz-three.csv", +).then(function (data2) { + const svg2 = d3.select("#tax-available"); + const circles2 = svg2.selectAll("circle"); + + circles2.data(data2); + + // Create a tooltip element + const tooltip = d3 + .select("body") + .append("div") + .attr("class", "tooltip") + .style("opacity", 0) + .style("position", "absolute") + .style("background-color", "white") + .style("border", "solid") + .style("border-width", "1px") + .style("border-radius", "5px") + .style("padding", "5px"); + + // Show tooltip on hover + circles2 + .on("mouseover", function (event, d) { + tooltip.transition().duration(200).style("opacity", 0.9); + tooltip + .html(`This Billion Dollars could belong to ${d.country}`) + .style("left", event.pageX + "px") + .style("top", event.pageY - 28 + "px"); + }) + .on("mouseout", function (d) { + tooltip.transition().duration(500).style("opacity", 0); + }); +}); From 4632b77ce611c04087bbf6af0e04ada3c2318506 Mon Sep 17 00:00:00 2001 From: Jack Parsons <65678430+jackparse14@users.noreply.github.com> Date: Wed, 5 Jun 2024 13:35:16 +0100 Subject: [PATCH 03/13] Create CNAME --- CNAME | 1 + 1 file changed, 1 insertion(+) create mode 100644 CNAME diff --git a/CNAME b/CNAME new file mode 100644 index 0000000..b339c52 --- /dev/null +++ b/CNAME @@ -0,0 +1 @@ +where.to.find.200.billion \ No newline at end of file From 1ad06a3441c466c45aa46df1f8fa8560d1810a97 Mon Sep 17 00:00:00 2001 From: Jack Parsons <65678430+jackparse14@users.noreply.github.com> Date: Wed, 5 Jun 2024 13:36:07 +0100 Subject: [PATCH 04/13] Update CNAME --- CNAME | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CNAME b/CNAME index b339c52..26aa1bd 100644 --- a/CNAME +++ b/CNAME @@ -1 +1 @@ -where.to.find.200.billion \ No newline at end of file +www.wheretofind200billion.com \ No newline at end of file From 2143fd86ac93809f0c3c5d3353b98d31a8854993 Mon Sep 17 00:00:00 2001 From: Jack Parsons <65678430+jackparse14@users.noreply.github.com> Date: Wed, 5 Jun 2024 13:36:38 +0100 Subject: [PATCH 05/13] Delete CNAME --- CNAME | 1 - 1 file changed, 1 deletion(-) delete mode 100644 CNAME diff --git a/CNAME b/CNAME deleted file mode 100644 index 26aa1bd..0000000 --- a/CNAME +++ /dev/null @@ -1 +0,0 @@ -www.wheretofind200billion.com \ No newline at end of file From ba044f5a6e20e6f6e587dad7008fee8b92b12ac1 Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 13:44:48 +0100 Subject: [PATCH 06/13] Renamed public folder to docs for github pages --- {public => docs}/.DS_Store | Bin {public => docs}/assets/.DS_Store | Bin {public => docs}/assets/Arrow-down.svg | 0 .../assets/dataviz-three-final.svg | 0 {public => docs}/assets/dataviz-two-final.svg | 0 {public => docs}/assets/dollar-icon.svg | 0 .../assets/private-vs-public-widescreen.svg | 0 {public => docs}/assets/static-viz-two.svg | 0 {public => docs}/css/styles.css | 0 {public => docs}/img/.DS_Store | Bin .../img/private-vs-public-mobile.svg | 0 .../img/private-vs-public-tablet.svg | 0 {public => docs}/index.html | 0 {public => docs}/js/dataViz.js | 0 {public => docs}/js/dataViz2.js | 0 {public => docs}/js/dataViz3.js | 0 {public => docs}/js/fade.js | 0 {public => docs}/js/intro.js | 21 +----------------- {public => docs}/js/labelsfordots.js | 0 {public => docs}/js/main.js | 0 {public => docs}/js/steps.js | 0 21 files changed, 1 insertion(+), 20 deletions(-) rename {public => docs}/.DS_Store (100%) rename {public => docs}/assets/.DS_Store (100%) rename {public => docs}/assets/Arrow-down.svg (100%) rename {public => docs}/assets/dataviz-three-final.svg (100%) rename {public => docs}/assets/dataviz-two-final.svg (100%) rename {public => docs}/assets/dollar-icon.svg (100%) rename {public => docs}/assets/private-vs-public-widescreen.svg (100%) rename {public => docs}/assets/static-viz-two.svg (100%) rename {public => docs}/css/styles.css (100%) rename {public => docs}/img/.DS_Store (100%) rename {public => docs}/img/private-vs-public-mobile.svg (100%) rename {public => docs}/img/private-vs-public-tablet.svg (100%) rename {public => docs}/index.html (100%) rename {public => docs}/js/dataViz.js (100%) rename {public => docs}/js/dataViz2.js (100%) rename {public => docs}/js/dataViz3.js (100%) rename {public => docs}/js/fade.js (100%) rename {public => docs}/js/intro.js (53%) rename {public => docs}/js/labelsfordots.js (100%) rename {public => docs}/js/main.js (100%) rename {public => docs}/js/steps.js (100%) diff --git a/public/.DS_Store b/docs/.DS_Store similarity index 100% rename from public/.DS_Store rename to docs/.DS_Store diff --git a/public/assets/.DS_Store b/docs/assets/.DS_Store similarity index 100% rename from public/assets/.DS_Store rename to docs/assets/.DS_Store diff --git a/public/assets/Arrow-down.svg b/docs/assets/Arrow-down.svg similarity index 100% rename from public/assets/Arrow-down.svg rename to docs/assets/Arrow-down.svg diff --git a/public/assets/dataviz-three-final.svg b/docs/assets/dataviz-three-final.svg similarity index 100% rename from public/assets/dataviz-three-final.svg rename to docs/assets/dataviz-three-final.svg diff --git a/public/assets/dataviz-two-final.svg b/docs/assets/dataviz-two-final.svg similarity index 100% rename from public/assets/dataviz-two-final.svg rename to docs/assets/dataviz-two-final.svg diff --git a/public/assets/dollar-icon.svg b/docs/assets/dollar-icon.svg similarity index 100% rename from public/assets/dollar-icon.svg rename to docs/assets/dollar-icon.svg diff --git a/public/assets/private-vs-public-widescreen.svg b/docs/assets/private-vs-public-widescreen.svg similarity index 100% rename from public/assets/private-vs-public-widescreen.svg rename to docs/assets/private-vs-public-widescreen.svg diff --git a/public/assets/static-viz-two.svg b/docs/assets/static-viz-two.svg similarity index 100% rename from public/assets/static-viz-two.svg rename to docs/assets/static-viz-two.svg diff --git a/public/css/styles.css b/docs/css/styles.css similarity index 100% rename from public/css/styles.css rename to docs/css/styles.css diff --git a/public/img/.DS_Store b/docs/img/.DS_Store similarity index 100% rename from public/img/.DS_Store rename to docs/img/.DS_Store diff --git a/public/img/private-vs-public-mobile.svg b/docs/img/private-vs-public-mobile.svg similarity index 100% rename from public/img/private-vs-public-mobile.svg rename to docs/img/private-vs-public-mobile.svg diff --git a/public/img/private-vs-public-tablet.svg b/docs/img/private-vs-public-tablet.svg similarity index 100% rename from public/img/private-vs-public-tablet.svg rename to docs/img/private-vs-public-tablet.svg diff --git a/public/index.html b/docs/index.html similarity index 100% rename from public/index.html rename to docs/index.html diff --git a/public/js/dataViz.js b/docs/js/dataViz.js similarity index 100% rename from public/js/dataViz.js rename to docs/js/dataViz.js diff --git a/public/js/dataViz2.js b/docs/js/dataViz2.js similarity index 100% rename from public/js/dataViz2.js rename to docs/js/dataViz2.js diff --git a/public/js/dataViz3.js b/docs/js/dataViz3.js similarity index 100% rename from public/js/dataViz3.js rename to docs/js/dataViz3.js diff --git a/public/js/fade.js b/docs/js/fade.js similarity index 100% rename from public/js/fade.js rename to docs/js/fade.js diff --git a/public/js/intro.js b/docs/js/intro.js similarity index 53% rename from public/js/intro.js rename to docs/js/intro.js index ba99647..4db6e6c 100644 --- a/public/js/intro.js +++ b/docs/js/intro.js @@ -6,25 +6,7 @@ export function intro() { const arrowElement = document.getElementById("fade-elements"); setTimeout(() => fadeIn(arrowElement, 10, 1), 4000); - startIntro(); - // setTimeout(3000); - - // let maxMarginTop = -1000; - // for (const circle of circles.children) { - // setTimeout(() => { - // let timer = setInterval(function () { - // if (circleMargin > maxMarginTop) { - // circleMargin = circleMargin + 1; - // circle.style.marginTop = circleMargin + "px"; - // console.log("move circle"); - // } else { - // clearInterval(timer); - // } - // }, 10); - // }, 4000); - // } -} -function startIntro() { + // startIntro(); let maxMargin = -85; for (const circle of circles.children) { setTimeout(() => fadeIn(circle, 20, 0.5), 2000); @@ -36,7 +18,6 @@ function startIntro() { circle.style.marginTop = circleMargin + "px"; } else { clearInterval(timer); - setTimeout(() => fadeOut(circle, 20), 1000); // The console is saying fadeout is not defined - needs fixing } }, 10); }, 2000); diff --git a/public/js/labelsfordots.js b/docs/js/labelsfordots.js similarity index 100% rename from public/js/labelsfordots.js rename to docs/js/labelsfordots.js diff --git a/public/js/main.js b/docs/js/main.js similarity index 100% rename from public/js/main.js rename to docs/js/main.js diff --git a/public/js/steps.js b/docs/js/steps.js similarity index 100% rename from public/js/steps.js rename to docs/js/steps.js From 988b14b2ec3601f6fffccd4fe6c9d33812e30554 Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 14:10:43 +0100 Subject: [PATCH 07/13] renamed docs folder back to public --- {docs => public}/.DS_Store | Bin {docs => public}/assets/.DS_Store | Bin {docs => public}/assets/Arrow-down.svg | 0 {docs => public}/assets/dataviz-three-final.svg | 0 {docs => public}/assets/dataviz-two-final.svg | 0 {docs => public}/assets/dollar-icon.svg | 0 .../assets/private-vs-public-widescreen.svg | 0 {docs => public}/assets/static-viz-two.svg | 0 {docs => public}/css/styles.css | 0 {docs => public}/img/.DS_Store | Bin {docs => public}/img/private-vs-public-mobile.svg | 0 {docs => public}/img/private-vs-public-tablet.svg | 0 {docs => public}/index.html | 0 {docs => public}/js/dataViz.js | 0 {docs => public}/js/dataViz2.js | 0 {docs => public}/js/dataViz3.js | 0 {docs => public}/js/fade.js | 0 {docs => public}/js/intro.js | 0 {docs => public}/js/labelsfordots.js | 0 {docs => public}/js/main.js | 0 {docs => public}/js/steps.js | 0 21 files changed, 0 insertions(+), 0 deletions(-) rename {docs => public}/.DS_Store (100%) rename {docs => public}/assets/.DS_Store (100%) rename {docs => public}/assets/Arrow-down.svg (100%) rename {docs => public}/assets/dataviz-three-final.svg (100%) rename {docs => public}/assets/dataviz-two-final.svg (100%) rename {docs => public}/assets/dollar-icon.svg (100%) rename {docs => public}/assets/private-vs-public-widescreen.svg (100%) rename {docs => public}/assets/static-viz-two.svg (100%) rename {docs => public}/css/styles.css (100%) rename {docs => public}/img/.DS_Store (100%) rename {docs => public}/img/private-vs-public-mobile.svg (100%) rename {docs => public}/img/private-vs-public-tablet.svg (100%) rename {docs => public}/index.html (100%) rename {docs => public}/js/dataViz.js (100%) rename {docs => public}/js/dataViz2.js (100%) rename {docs => public}/js/dataViz3.js (100%) rename {docs => public}/js/fade.js (100%) rename {docs => public}/js/intro.js (100%) rename {docs => public}/js/labelsfordots.js (100%) rename {docs => public}/js/main.js (100%) rename {docs => public}/js/steps.js (100%) diff --git a/docs/.DS_Store b/public/.DS_Store similarity index 100% rename from docs/.DS_Store rename to public/.DS_Store diff --git a/docs/assets/.DS_Store b/public/assets/.DS_Store similarity index 100% rename from docs/assets/.DS_Store rename to public/assets/.DS_Store diff --git a/docs/assets/Arrow-down.svg b/public/assets/Arrow-down.svg similarity index 100% rename from docs/assets/Arrow-down.svg rename to public/assets/Arrow-down.svg diff --git a/docs/assets/dataviz-three-final.svg b/public/assets/dataviz-three-final.svg similarity index 100% rename from docs/assets/dataviz-three-final.svg rename to public/assets/dataviz-three-final.svg diff --git a/docs/assets/dataviz-two-final.svg b/public/assets/dataviz-two-final.svg similarity index 100% rename from docs/assets/dataviz-two-final.svg rename to public/assets/dataviz-two-final.svg diff --git a/docs/assets/dollar-icon.svg b/public/assets/dollar-icon.svg similarity index 100% rename from docs/assets/dollar-icon.svg rename to public/assets/dollar-icon.svg diff --git a/docs/assets/private-vs-public-widescreen.svg b/public/assets/private-vs-public-widescreen.svg similarity index 100% rename from docs/assets/private-vs-public-widescreen.svg rename to public/assets/private-vs-public-widescreen.svg diff --git a/docs/assets/static-viz-two.svg b/public/assets/static-viz-two.svg similarity index 100% rename from docs/assets/static-viz-two.svg rename to public/assets/static-viz-two.svg diff --git a/docs/css/styles.css b/public/css/styles.css similarity index 100% rename from docs/css/styles.css rename to public/css/styles.css diff --git a/docs/img/.DS_Store b/public/img/.DS_Store similarity index 100% rename from docs/img/.DS_Store rename to public/img/.DS_Store diff --git a/docs/img/private-vs-public-mobile.svg b/public/img/private-vs-public-mobile.svg similarity index 100% rename from docs/img/private-vs-public-mobile.svg rename to public/img/private-vs-public-mobile.svg diff --git a/docs/img/private-vs-public-tablet.svg b/public/img/private-vs-public-tablet.svg similarity index 100% rename from docs/img/private-vs-public-tablet.svg rename to public/img/private-vs-public-tablet.svg diff --git a/docs/index.html b/public/index.html similarity index 100% rename from docs/index.html rename to public/index.html diff --git a/docs/js/dataViz.js b/public/js/dataViz.js similarity index 100% rename from docs/js/dataViz.js rename to public/js/dataViz.js diff --git a/docs/js/dataViz2.js b/public/js/dataViz2.js similarity index 100% rename from docs/js/dataViz2.js rename to public/js/dataViz2.js diff --git a/docs/js/dataViz3.js b/public/js/dataViz3.js similarity index 100% rename from docs/js/dataViz3.js rename to public/js/dataViz3.js diff --git a/docs/js/fade.js b/public/js/fade.js similarity index 100% rename from docs/js/fade.js rename to public/js/fade.js diff --git a/docs/js/intro.js b/public/js/intro.js similarity index 100% rename from docs/js/intro.js rename to public/js/intro.js diff --git a/docs/js/labelsfordots.js b/public/js/labelsfordots.js similarity index 100% rename from docs/js/labelsfordots.js rename to public/js/labelsfordots.js diff --git a/docs/js/main.js b/public/js/main.js similarity index 100% rename from docs/js/main.js rename to public/js/main.js diff --git a/docs/js/steps.js b/public/js/steps.js similarity index 100% rename from docs/js/steps.js rename to public/js/steps.js From b3afb1010b86dd5ffe40f2236359f1490557849f Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 14:45:28 +0100 Subject: [PATCH 08/13] Removed eslint errors --- public/js/labelsfordots.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/public/js/labelsfordots.js b/public/js/labelsfordots.js index 45ec6b6..864787c 100644 --- a/public/js/labelsfordots.js +++ b/public/js/labelsfordots.js @@ -33,7 +33,7 @@ circles1 .style("left", event.pageX + "px") .style("top", event.pageY - 28 + "px"); }) - .on("mouseout", function (d) { + .on("mouseout", function () { tooltip1.transition().duration(500).style("opacity", 0); }); @@ -68,7 +68,7 @@ d3.csv( .style("left", event.pageX + "px") .style("top", event.pageY - 28 + "px"); }) - .on("mouseout", function (d) { + .on("mouseout", function () { tooltip.transition().duration(500).style("opacity", 0); }); }); @@ -104,7 +104,7 @@ d3.csv( .style("left", event.pageX + "px") .style("top", event.pageY - 28 + "px"); }) - .on("mouseout", function (d) { + .on("mouseout", function () { tooltip.transition().duration(500).style("opacity", 0); }); }); From dfa4d7dfe6e1bf140923117b61990822ac3e424a Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 15:32:29 +0100 Subject: [PATCH 09/13] Fixed mouseover on dataviz 2 --- public/css/styles.css | 15 +++++++++++++-- public/index.html | 19 +++++++++++-------- public/js/dataViz.js | 4 ++-- public/js/intro.js | 9 +++++---- public/js/labelsfordots.js | 23 ++++++++++++----------- public/js/main.js | 4 ---- public/js/steps.js | 11 +++-------- 7 files changed, 46 insertions(+), 39 deletions(-) diff --git a/public/css/styles.css b/public/css/styles.css index bdb3539..f8b32ed 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -158,7 +158,7 @@ article { } .step { - height: 100vh; + height: 90vh; width: 100%; margin-top: 200px; } @@ -177,6 +177,15 @@ div > p { padding: 1rem; font-size: var(--small-fs); } +#billion-dollar-dot { + height: 50vh; + width: 100%; + margin: auto; +} +#dataviz3-text { + margin-top: 100px; + margin-bottom: 100px; +} /* Media Queries */ @@ -206,7 +215,8 @@ div > p { padding: 0px; } - #Layer_1 { + #Layer_1, + #Layer_2 { max-width: 800px; max-height: 800px; display: block; @@ -216,6 +226,7 @@ div > p { #layer_2 { display: block; margin: auto; + margin-top: -200px; } #billion-dollar-dot { diff --git a/public/index.html b/public/index.html index 132bac8..c931e13 100644 --- a/public/index.html +++ b/public/index.html @@ -378,7 +378,7 @@

It's down here

Billionaires are paying significantly less tax than anyone else.

- + @@ -15243,13 +15243,16 @@

It's down here

-

So where can you find $200 billion? -

-

Right here. It is hiding in plain sight. -

-

If a 2% minimum tax on billionaires is introduced, we would raise $214 billion from less than 3000 - individuals. Hover over the dot to find out which part of the World could claim that billion dollars. -

+
+

So where can you find $200 billion? +

+

Right here. It is hiding in plain sight. +

+

If a 2% minimum tax on billionaires is introduced, we would raise $214 billion from less than 3000 + individuals. Hover over the dot to find out which part of the World could claim that billion dollars. +

+
+
diff --git a/public/js/dataViz.js b/public/js/dataViz.js index 03b6eb5..fa317bd 100644 --- a/public/js/dataViz.js +++ b/public/js/dataViz.js @@ -148,7 +148,7 @@ export function moveBlueCircle() { .transition() .duration(3000) .delay((_, i) => i * 750) - .attr("cx", (_, i) => x(0)) + .attr("cx", () => x(0)) .attr("cy", (d) => startHeight - radiusScale(d) * 1.5) .attr("r", (d) => radiusScale(d) * 1.5); @@ -158,7 +158,7 @@ export function moveBlueCircle() { .transition() .duration(3000) .delay((_, i) => i * 750) - .attr("cx", (_, i) => x(1)) + .attr("cx", () => x(1)) .attr("cy", (d) => startHeight - radiusScale(d) * 1.5) .attr("r", (d) => radiusScale(d) * 1.5); diff --git a/public/js/intro.js b/public/js/intro.js index 4db6e6c..e19abad 100644 --- a/public/js/intro.js +++ b/public/js/intro.js @@ -1,15 +1,15 @@ -import { fadeIn } from "./fade.js"; +import { fadeIn, fadeOut } from "./fade.js"; const circles = document.getElementById("circles-intro"); let circleMargin = -85; export function intro() { const arrowElement = document.getElementById("fade-elements"); - setTimeout(() => fadeIn(arrowElement, 10, 1), 4000); + setTimeout(() => fadeIn(arrowElement, 10, 1), 2000); // startIntro(); let maxMargin = -85; for (const circle of circles.children) { - setTimeout(() => fadeIn(circle, 20, 0.5), 2000); + setTimeout(() => fadeIn(circle, 20, 0.5), 1000); circle.maxM = maxMargin += 100; setTimeout(() => { let timer = setInterval(function () { @@ -18,8 +18,9 @@ export function intro() { circle.style.marginTop = circleMargin + "px"; } else { clearInterval(timer); + setTimeout(() => fadeOut(circle, 20, 0.5), 1000); } }, 10); - }, 2000); + }, 1000); } } diff --git a/public/js/labelsfordots.js b/public/js/labelsfordots.js index 864787c..250863c 100644 --- a/public/js/labelsfordots.js +++ b/public/js/labelsfordots.js @@ -60,17 +60,18 @@ d3.csv( .style("padding", "5px"); // Show tooltip on hover - circles2 - .on("mouseover", function (event, d) { - tooltip.transition().duration(200).style("opacity", 0.9); - tooltip - .html(`This Billion Dollars belongs to ${d.name}`) - .style("left", event.pageX + "px") - .style("top", event.pageY - 28 + "px"); - }) - .on("mouseout", function () { - tooltip.transition().duration(500).style("opacity", 0); - }); + circles2.on("mouseenter", function (event, d) { + console.log("mouseover"); + tooltip.transition().duration(200).style("opacity", 0.9); + tooltip + .html(`This Billion Dollars belongs to ${d.name}`) + .style("left", event.pageX + "px") + .style("top", event.pageY - 28 + "px"); + }); + // .on("mouseexit", function () { + // console.log("mouseout"); + // tooltip.transition().duration(500).style("opacity", 0); + // }); }); /* LABELS FOR THE LAST VIZ */ diff --git a/public/js/main.js b/public/js/main.js index 9a7ed11..5de973a 100644 --- a/public/js/main.js +++ b/public/js/main.js @@ -7,7 +7,6 @@ import { enterStepThree, enterStepTwo, enterStepFour, - exitStepOne, revertToStepOne, revertToStepTwo, } from "./steps.js"; @@ -64,9 +63,6 @@ function handleStepEnter(res) { } function handleStepExit(res) { switch (res.index) { - case 0: - exitStepOne(); - break; case 4: stopDataViz2(); break; diff --git a/public/js/steps.js b/public/js/steps.js index 5de98a8..b51074d 100644 --- a/public/js/steps.js +++ b/public/js/steps.js @@ -1,4 +1,4 @@ -import { fadeIn, fadeOut, fadeInSVG } from "./fade.js"; +import { fadeOut, fadeInSVG } from "./fade.js"; import { changeSize, hideDataPoints, @@ -27,12 +27,6 @@ export function revertToStepOne() { restartDataViz(); } -export function exitStepOne() { - for (const circle of introCircles.children) { - fadeIn(circle, 20, 0.5); - } -} - export function enterStepTwo() { dataViz1.setAttribute("height", "600px"); transitionToStep(step2); @@ -53,7 +47,8 @@ export function enterStepFour() { } function transitionToStep(step) { - step.append(dataViz1); dataViz1.firstChild.setAttribute("opacity", "0"); + step.append(dataViz1); + fadeInSVG(dataViz1.firstChild, 10, 1); } From 53abec504b3f64c9eec99a780552e9e622913ef5 Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 15:53:50 +0100 Subject: [PATCH 10/13] Spacing Changes --- public/css/styles.css | 19 +++++++++++++++---- public/index.html | 3 ++- public/js/labelsfordots.js | 21 ++++++++++----------- 3 files changed, 27 insertions(+), 16 deletions(-) diff --git a/public/css/styles.css b/public/css/styles.css index f8b32ed..5a788c4 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -178,14 +178,26 @@ div > p { font-size: var(--small-fs); } #billion-dollar-dot { - height: 50vh; + height: 80vh; width: 100%; - margin: auto; } +#billions-of-dots { + padding: 100px; +} + #dataviz3-text { margin-top: 100px; margin-bottom: 100px; } +#tax-available { + width: 100%; + height: 80vh; + margin-bottom: 100px; +} +#Layer_2 { + height: 90vh; + width: 100%; +} /* Media Queries */ @@ -223,10 +235,9 @@ div > p { margin: auto; } - #layer_2 { + #Layer_2 { display: block; margin: auto; - margin-top: -200px; } #billion-dollar-dot { diff --git a/public/index.html b/public/index.html index c931e13..1d5ad2f 100644 --- a/public/index.html +++ b/public/index.html @@ -59,7 +59,7 @@

It's down here

This minute portion of the population has captured an outsized amount of total global wealth.

-
+
@@ -88,6 +88,7 @@

It's down here

+

In the 1980s, Thatcher and Reagan championed a radical new idea: Individuals should be free to pursue wealth diff --git a/public/js/labelsfordots.js b/public/js/labelsfordots.js index 250863c..f385972 100644 --- a/public/js/labelsfordots.js +++ b/public/js/labelsfordots.js @@ -97,15 +97,14 @@ d3.csv( .style("padding", "5px"); // Show tooltip on hover - circles2 - .on("mouseover", function (event, d) { - tooltip.transition().duration(200).style("opacity", 0.9); - tooltip - .html(`This Billion Dollars could belong to ${d.country}`) - .style("left", event.pageX + "px") - .style("top", event.pageY - 28 + "px"); - }) - .on("mouseout", function () { - tooltip.transition().duration(500).style("opacity", 0); - }); + circles2.on("mouseenter", function (event, d) { + tooltip.transition().duration(200).style("opacity", 0.9); + tooltip + .html(`This Billion Dollars could belong to ${d.country}`) + .style("left", event.pageX + "px") + .style("top", event.pageY - 28 + "px"); + }); + // .on("mouseout", function () { + // tooltip.transition().duration(500).style("opacity", 0); + // }); }); From 738bb7be2457537c82b25b36b051c25f8dc32717 Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 16:09:43 +0100 Subject: [PATCH 11/13] Fixed bug with DataViz that didnt reset circle opacity --- public/js/dataViz.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/public/js/dataViz.js b/public/js/dataViz.js index fa317bd..d60829b 100644 --- a/public/js/dataViz.js +++ b/public/js/dataViz.js @@ -79,7 +79,8 @@ export function startDataViz() { .duration(3000) .delay((d, i) => i * 750) // Transition to final positions based on data - .attr("cx", (_, i) => x(i)); + .attr("cx", (_, i) => x(i)) + .attr("opacity", 0.5); } export function restartDataViz() { hideLines(); @@ -89,7 +90,8 @@ export function restartDataViz() { .duration(3000) .attr("cy", startHeight - initialRadius) .attr("r", initialRadius) - .attr("cx", (_, i) => x(i)); + .attr("cx", (_, i) => x(i)) + .attr("opacity", 0.5); } // STEP TWO FUNCTIONS From 15a4f8c102e33323c678a62fc3efe37af3565de4 Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 16:11:09 +0100 Subject: [PATCH 12/13] removed assignment --- public/js/dataViz2.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/js/dataViz2.js b/public/js/dataViz2.js index b94dee1..729cfe8 100644 --- a/public/js/dataViz2.js +++ b/public/js/dataViz2.js @@ -52,7 +52,7 @@ export function startDataViz2() { }; // Append circles for each data point - var circles = svg + svg .selectAll(".node") .data(data) .enter() From 140219dac58ab1c1b051dbb27e3d264ef66c5aba Mon Sep 17 00:00:00 2001 From: Jack Parsons Date: Wed, 5 Jun 2024 16:23:28 +0100 Subject: [PATCH 13/13] Implemented snap function --- public/css/styles.css | 19 +++++++++++++++++++ public/index.html | 3 +-- 2 files changed, 20 insertions(+), 2 deletions(-) diff --git a/public/css/styles.css b/public/css/styles.css index 5a788c4..94ea317 100644 --- a/public/css/styles.css +++ b/public/css/styles.css @@ -199,6 +199,25 @@ div > p { width: 100%; } +/* SNAP FEATURE */ + +/* #scroll-art-one { + overflow-y: auto; + white-space: nowrap; + display: flex; +} +#scroll-art-one.snap { + flex-direction: column; + scroll-snap-type: y mandatory; +} +#scroll-art-one.snap > div { + scroll-snap-align: center; + scroll-snap-points-x: initial; + -ms-scroll-snap-points-x: initial; + scroll-snap-points-y: repeat(100%); + -ms-scroll-snap-points-y: repeat(100%); +} */ + /* Media Queries */ @media (max-width: 1720px) { diff --git a/public/index.html b/public/index.html index 1d5ad2f..a721757 100644 --- a/public/index.html +++ b/public/index.html @@ -45,7 +45,7 @@

It's down here

-
+

Most would like to be a little wealthier. Some want to be the wealthiest. @@ -70,7 +70,6 @@

It's down here

The poorest half of the World share 2% of all the wealth in the World. The top 10% have captured 78%.

-