English | 简体中文

The visualization of the NCP

It's the front-end of the coursework about the course advanced program

Aim

• Visualize the NCP data
• Beautiful interface
• Support end-user interaction to query the data of different regions(provinces/cities)

How to run the demo?

1. clone the repository

git clone https://github.com/HCI-AP-team/AP-coursework-front-end.git

2. install nodeJS(with npm) and install yarn(recomand install yarn global)

npm i yarn -g

‼️ Hint: If you are using npm in China, maybe you can consider about replacing the source of the npm(nrm is a good choice).

3. in the root directory of the project, run the two commands

yarn 
yarn start

4. the project will run in 3000 port, you can visit it in localhost:3000

‼️ if something is running in 3000 port, the project will choose another port to run.

Features

• ⚛️ react
• ⚠️ typescript
• 👀 jss
• 💎 material-ui
• ✏️ d3
• 🐜 antv
• 📜 scrollreveal
• 💻 tensorflow-js

Tasklist

• Homepage display
• International status
• General situation of China
• Provinces comparison
• Cities detail
• News

contributor