From c4db1aa5875e5d55432d0a8ecd56f3b3e776123f Mon Sep 17 00:00:00 2001 From: T__o Date: Thu, 23 Apr 2020 17:52:44 +0200 Subject: [PATCH] repack, data auto loading --- README.md | 23 +- brain.md | 29 ++ doc.md | 23 ++ package.json | 10 +- public/index.html | 2 + src/App.vue | 225 ++++++++++-- src/components/ChartConfig.vue | 110 ++++++ src/components/CountriesConfig.vue | 156 +++++++++ src/components/DataLoader.vue | 96 ++++++ src/components/HelloWorld.vue | 58 ---- src/components/MultiBarChartSingle.vue | 99 ++++++ src/components/d3/BarChartSingle.vue | 156 +++++++++ src/components/d3/MultiCountryChart.vue | 208 +++++++++++ src/components/html/Counter.vue | 93 +++++ src/components/html/Palette.vue | 71 ++++ src/components/html/SelectO.vue | 77 +++++ src/libs/thpalette.js | 112 ++++++ src/main.js | 4 +- src/plugins/vuetify.js | 7 + vue.config.js | 5 + yarn.lock | 437 +++++++++++++++++++++++- 21 files changed, 1889 insertions(+), 112 deletions(-) create mode 100644 brain.md create mode 100644 doc.md create mode 100644 src/components/ChartConfig.vue create mode 100644 src/components/CountriesConfig.vue create mode 100644 src/components/DataLoader.vue delete mode 100644 src/components/HelloWorld.vue create mode 100644 src/components/MultiBarChartSingle.vue create mode 100644 src/components/d3/BarChartSingle.vue create mode 100644 src/components/d3/MultiCountryChart.vue create mode 100644 src/components/html/Counter.vue create mode 100644 src/components/html/Palette.vue create mode 100644 src/components/html/SelectO.vue create mode 100644 src/libs/thpalette.js create mode 100644 src/plugins/vuetify.js create mode 100644 vue.config.js diff --git a/README.md b/README.md index bff48ad..41f931d 100644 --- a/README.md +++ b/README.md @@ -1,24 +1,9 @@ # covcharts -## Project setup -``` -yarn install -``` +Charts on COVID 19 -### Compiles and hot-reloads for development -``` -yarn serve -``` +Using vuejs and d3 -### Compiles and minifies for production -``` -yarn build -``` +Data source from : https://github.com/pomber/covid19 + -### Lints and fixes files -``` -yarn lint -``` - -### Customize configuration -See [Configuration Reference](https://cli.vuejs.org/config/). diff --git a/brain.md b/brain.md new file mode 100644 index 0000000..fad8571 --- /dev/null +++ b/brain.md @@ -0,0 +1,29 @@ + +# todo list + +## First production : + +load data source +vuejs prod +git clean +hosting + + +load data source +local storage : + save all data + save timeStamp + +on load + if delay > 1hour : reload data + + + +Data source : + https://github.com/pomber/covid19 + +curl -o data/timeseries0.json https://pomber.github.io/covid19/timeseries.json + + + + diff --git a/doc.md b/doc.md new file mode 100644 index 0000000..7e0b3b9 --- /dev/null +++ b/doc.md @@ -0,0 +1,23 @@ + + + +# Changelog + +v0.01 repack, data auto loading + + +### Project dataviz d3js vue + +https://medialab.sciencespo.fr/actu/coronavirus-country-comparator/ +https://boogheta.github.io/coronavirus-countries/#deceased&places=China,France,Iran,Italy,Spain,USA,United%20Kingdom&alignTo=deceased +https://github.com/boogheta/coronavirus-countries/blob/master/js/corona.js + + +### vuejs d3 + +Workshop : +Composing D3.js Visuals with Vue.js Workshop https://www.youtube.com/watch?v=CkFktv0p3pw +Visualizing Hierarchies with Vue.js and D3.js https://www.youtube.com/watch?v=GuecoTcqmVE + +Bar with animation : +https://codepen.io/callumacrae/pen/oyXXWR \ No newline at end of file diff --git a/package.json b/package.json index e8b5288..0a3663b 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,9 @@ }, "dependencies": { "core-js": "^3.6.4", - "vue": "^2.6.11" + "d3": "^5.16.0", + "vue": "^2.6.11", + "vuetify": "^2.2.11" }, "devDependencies": { "@vue/cli-plugin-babel": "^4.3.0", @@ -18,7 +20,11 @@ "babel-eslint": "^10.1.0", "eslint": "^6.7.2", "eslint-plugin-vue": "^6.2.2", - "vue-template-compiler": "^2.6.11" + "sass": "^1.19.0", + "sass-loader": "^8.0.0", + "vue-cli-plugin-vuetify": "^2.0.5", + "vue-template-compiler": "^2.6.11", + "vuetify-loader": "^1.3.0" }, "eslintConfig": { "root": true, diff --git a/public/index.html b/public/index.html index 4123528..bc51465 100644 --- a/public/index.html +++ b/public/index.html @@ -6,6 +6,8 @@ <%= htmlWebpackPlugin.options.title %> + +