Station Cards
Commons Support avatar
Written by Commons Support
Updated over a week ago

The Station Card is a mobile-friendly mapping application feature for communicating your Water Reporter data. The Station Card was built using the Water Reporter API. The Station Card was launched as an offering for organization account holders in March 2022.

What is the Station Card Feature?

The Station Card features current readings and trends data views, as well as QR code share-ability and unique URLs for prioritizing a particular station and parameter.

Each station now has a unique URL that pushes out to a pre-configured station card. This URL and corresponding embed code can be used to do the following:

  • create station specific maps

  • share station specific information to audiences through a variety of channels including social media

  • Create QR codes to print and post at monitoring locations so visitors can reference the latest readings streamside.

The station card can help your audiences answer questions like:

  • What is the current water quality?

  • Where are other monitoring stations?

  • What does this parameter # mean? (custom thresholds and indicators)

  • Is it safe to recreate? (build outdoor enthusiast's relationship to water quality)

Configuration & Use

Unlike other features provided through Water Reporter, the Station Card is built on the public API and hosted through an R-Shiny application. All Subscription Holders can access the basic version through their data source and information on how to grab the URL codes is listed below. For groups who want to further configure or customize the station card, you can access the GitHub repository to pull the code and materials to reconfigure the basic setup.

Steps to Use the Default Station Card

STEP 1. Make your data source public

Data sources must be made public in order to take advantage of the API functionality, including use of Station Cards. Make your data source public on the Summary Page or Visualizations page within each data source. Uncheck the box to make the data source public.

NOTE: If you have individual stations that you want to have a different visualization status you will want to use the "archive" setting within the station settings page.

Step 2. Find a Data Source’s Station Card URL in two places

Option 1. Stations Tab

The benefit of accessing the url from the station itself is that the url will already have the correct station ID inserted into the URL. If you want to access the embed code, however, you will need to grab that from the Visualizations tab.

Open the link from the Station Card

The link will open an application that is both web-browser and mobile device friendly.

Click on the QR code to bring up a larger version of the image. You can save and print the image if you want to place it somewhere for easy access.

A note on QR Codes. Each QR code is station specific. Meaning that if you have a data source with three stations you can print out three unique QR codes. When someone accesses the station card through a QR code, the data for that specific station will appear. The user can tap on different stations to navigate around to all data stored within the data source.

Option 2. Visualizations tab

If you access the Station Card link from the Visualizations tab, you will need to identify which station you want to appear before the URL will point to each specific station.

Open the link from the Visualization Tab

When you choose to open the link from the visualizations tab, you will want to add additional details to your url. We recommend that you open up a text document and copy/paste the base code from under the URL heading. Then append the following based on what you want to display:

STATION: “&station={YourStationID}” to the base URL

PARAMETER: “&parameter={YourParameterID}” to the base URL

You can find these IDs in the corresponding tab in the data source. For example, click on STATIONS on the right hand side and then click on a specific Station. Then, look up at the URL in the browser navigation.

21884 = YourStationID

You will want to grab the station ID for each station if you want to create a separate URL code and QR code for each.

Once you have configured your URL with the station and parameter specific information on where you want to point your application, load the URL into your web browser.

Your outputs will looks like this:

If no station or parameter is selected, it will default to the station with the most readings and the first parameter alphabetically.

Configuration Documentation

More sophisticated users in need of building their own applications or building off of the default version of the Station Card is also possible. You can access the Github repository for the Station Card if you're a developer who would like to modify it for your own purposes.

Did this answer your question?