Interactive web application for parsing .tcx and .gpx files from different sources. The application enables visualization analysis and provides real-time data visualization. This project aims to improve the data visualization of raw files that were previously extracted from various sports devices such as sports trackers or other external devices.
The project was inspired from existing project sport-activities-features that was later on upgraded with feature sport-activities-api which is a Python library with REST API architecture that this project is using for interactive data manipulation.
The purpose of this project is to bring closer weather conditions within the sports activity and find various data associations that are difficult to see without a closer look. My interest in weather also motivates me to implement such features in rich analysis and coordination with my mentor for this project dr. I. Jr. Fister is priceless.
Different kinds of data visualization for sports analysis are available.
- Upload TCX and GPX files
- Sport data analysis
- Chart visualization
- Zoom for details (chart)
- Table visualization (integral metrics)
- Weather conditions within the exercise
- Realtime data visualization
- Local storage usage
- Map visualization
- User registration
- Calendar visualization
- Hill identification(rendering image)
- Data comparison
This project is implemented in the Vue3 javascript framework.
It can be cloned or downloaded to your device, whether you are Linux or Windows user.
For both Linux and Windows users:
This project is developed using NPM version 8.1.1, and it should work with any newer versions.
Open the terminal and go to root of your project directory. Then you paste the following command:
- with NPM installed
npm install
- with YARN installed
yarn install
When the previous step is completed, you can run your project with the following command:
- with NPM installed
npm run serve
- with YARN installed
yarn run serve
Open your browser and go to this URL: http://localhost:8080
It is possible to dockerize app with Dockerfile available. You have to follow next commands to setup environment:
docker build -t vuejs-cookbook/dockerize-vuejs-app .
docker run -it -p 8080:8080 --rm --name dockerize-vuejs-app-1 vuejs-cookbook/dockerize-vuejs-app
Open your browser and go to this URL: http://localhost:8080. It should work!
To prepare your project for production use, proceed with the following command:
- with NPM installed
npm run build
- with YARN installed
yarn run build
It will create /dist folder in your root of the project with compiled and minified code. Copy and paste the content of the /dist folder to your website directory.
Users must register and login in order to use this application.
User data is only saved in the local storage of the client's browser and is not sent to any other device. When you clean up your browser's local storage, you are prompted to register and login to be able to use your application again.
[1] I. Jr. Fister, L. Lukač, A. Rajšp, I. Fister, L. Pečnik and D. Fister, "A minimalistic toolbox for extracting features from sport activity files", 2021 IEEE 25th International Conference on Intelligent Engineering Systems (INES), 2021, pp. 121-126, DOI: 10.1109/INES52918.2021.9512927.
[2] I. Jr. Fister, S. Rauter, D. Fister, I. Fister, "A collection of sport activity datasets for data analysis and data mining 2017a", 2017.
[3] I. Jr. Fister, S. Rauter, D. Fister, I. Fister, "A collection of sport activity datasets with an emphasis on power meter data", 2017.
This project is distributed under the MIT License. This license can be found online at http://www.opensource.org/licenses/MIT.
This framework is provided as-is, and there are no guarantees that it fits your purposes or that it is bug-free. Use it at your own risk!