Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/abdallahabusedo/covid19-visualization
https://github.com/abdallahabusedo/covid19-visualization
api chart chartjs charts covid-19 covid19 vue vue-chartjs vue3 vuejs
Last synced: 14 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/abdallahabusedo/covid19-visualization
- Owner: abdallahabusedo
- Created: 2022-08-22T13:46:53.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2022-08-22T19:01:34.000Z (about 2 years ago)
- Last Synced: 2024-10-11T06:01:32.010Z (27 days ago)
- Topics: api, chart, chartjs, charts, covid-19, covid19, vue, vue-chartjs, vue3, vuejs
- Language: Vue
- Homepage:
- Size: 776 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# covid19-visualization
the perpuse of this project is to learn the Chart.js library after they change the syntax so it must to go through it and learn the new syntax
the project is just a small visualization of the COVID19 data
if you see the `App.vue` you will find the API call
```JS
async created(){
const {data} = await axios.get('https://api.covid19api.com/live/country/egypt')
data.forEach(d => {
const date = moment(d.Date,"YYYYMMDD").format("YYYY/MM/DD")
const {Confirmed,Deaths,Recovered} = d
this.PositiveCases.push({date, total : Confirmed})
this.Deaths.push({date, total : Deaths})
this.Recoverd.push({date, total : Recovered})
this.dates = this.PositiveCases.map(d => d.date)
this.PositiveCasestotals = this.PositiveCases.map(d => d.total)
this.DeathsToltals = this.Deaths.map(d => d.total)
this.RecoverdToltals = this.Recoverd.map(d => d.total)
```
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
# ScreenShots
