First, lets go through the options of using this service:
“On the fly”
You can use this service “on the fly” by just opening the chart page in your browser, drag a statistics file from your computer to the page and you will get charts immediately.
Advantages: you don’t need to set up any account, and you do not share the data with the server. You can grab a screenshot of the chart using your favorite snip-tool or right click the chart and download it at a transparent image.
Drawbacks: you can’t share the charts as links, and if you want to update your charts in the future you will need to grab new screen shots and share them the same way you did the first time.
Sign up for an account
If you sign up for an account, you can upload your data files to our server and you will get a link to the charts based on your uploaded file. If you upload a new file with the same name, it will replace the first file and the charts provided via the original link will be updated.
A typical link will look like this:
https://coursestats.lillfiluren.se/charts/?wp=jonas/play-counts-taeby-discgolfbana.csv
Advantages: Easy, sharable links that can be updated with new data later
Drawbacks: Need to create an account and upload your data to this server
Host the data file on your server
If you want to host the data file on your server, but use the code for the charts on our server, that is fine too, but will require some configuration on your end.
First of all, lets assume you have a web server on the domain “mydomain.com” and that you place your statistics file in the folder “stats”, the link to your charts would be:
https://coursestats.lillfiluren.se/charts/?url=mydomain.com/stats/play-counts.csv
The configuration you need to do are to ensure the following:
- Your webserver supports https
- Your webserver allows cross-origin requests from coursestats.lillfiluren.se
The first requirement is probably already supported by your server, after all it is 2024, and no one should serve web content over http. The second one is a little trickier and will probably require you to configure a .htaccess-file that allows the CORS requests that this the browser will make to your server to grab the data file.
If you use apache, and have mod_headers installed, you can use the sample .htaccess-file in the gitrepo. If not, you are on your own.
Advantages: No need for an account on this server, no need to upload your datafiles to this server. You still get sharable links and you get future updates and improvements to the chart page automatically
Drawbacks: requires some technical skills and a webserver
Clone the git repo
If you want to make your own modifications to the charts, you can clone the git repo with the source for the charts. You can host them wherever you like, run them locally. If you make any improvements that might benefit others, you are welcome but not required to make a pull request.
If you host the source and the datafile in the same folder, the link to your charts would be something like:
https://mydomain.com/coursestats/index.html?data=play-counts.csv
All available parameters
Here is a list of the supported parameters:
| wp=<path> | loads the data file for the charts from a folder on the same server with the path /wp-content/stats/<path> |
| data=<path> | loads the data file from a folder relative to the location of the location of the html-file |
| url=<path> | Will prepend “https://” to the path and use that URL to load the data. Make sure the server supports CORS requests. |
| first-year=2019 | will exclude all stats prior the specified year, default is to include all data in the chart |
| lang=<lang> | Will use translated strings. Currently supported languages: * en – English * se – Swedish If you are interested in translating the charts for your own language, contact me. There are currently only a handful of strings to translate. |
| course-name=<name> | Will add a header to the chart |
| include-last-month | The last month is typically incomplete and therefor omitted from the charts. If you want to include it anyway, just add the parameter to your url. |
