Skip to content

Technical Documentation

Britt Sikora edited this page Mar 21, 2018 · 14 revisions

User Requirements

  • View multiple subject measures for an individual over time
  • Select the time variable to display on the x-axis
  • View visits without data
  • View unscheduled visits
  • View normal range inliers
  • Select a normal range method
  • Create custom filters
  • View normal ranges for a measure
  • View all measures
  • Hide all measures
  • View an individual measure
  • Hide an individual measure
  • View a large version of a chart
  • Click and drag on an area to view multiple data points
  • View a listing of the underlying data
  • Search the data listing
  • Sort the data listing
  • Navigate the data listing via pagination controls
  • Export the data listing to a .csv file

Functional Specifications

X-Axis Filter

The controls contain a filter that lets users choose the display of the x-axis. Users can view the x-axis data by study day, visit number , or visit. The default is to display the x-axis by study day. The x-axis displays the point in time in which the data is collected and manipulating it changes the scale at which the data is plotted.

Inlier Count

Users can view how many participants fall within the normal range for a measure by observing the small, green box to the bottom-left of each chart. This box contains an integer that corresponds to the number of subjects that fall within the normal range and are excluded from that chart on initial load. When the normal range method changes or is set to "None" the count in the box will change to reflect the new number of participants with inlier data. When there are no participants to display, the box will disappear. The box will reappear when the normal range is manipulated and participants fall within the normal ranges again.

View Normal Range Inliers

Participants with data that fall within a normal range for a measure are hidden by default. Users can select the checkbox to view inlier participants. Selecting to view inliers will render their data in each chart and will remove the inlier count to the left of the chart. Selecting to hide inliers will remove the inlier data from each chart and will show the inlier count to the left of each chart.

Normal Range Controls

Users can opt to change the method for the normal ranges to the following options: None, LLN-ULN, Standard Deviation, and Quantiles. The default for the normal range controls is set to "LLN-ULN", which is the upper and lower normal range specified in the data. Users may select "None", which will remove the green shading around the normal ranges and will remove the inlier count to the left of the charts. Users may also select "Standard Deviation", which will prompt the user to enter the number of standard deviations they would like to set as the normal range. Altering the default value will change the upper and lower normal range bands in the chart and will change the inlier count to the left of the chart. Users may also select "Quantiles", which prompts the user to enter an upper and lower quantile to set as the normal ranges. Altering the upper quantile will change the upper normal range band in the chart and altering the lower quantile will change the lower normal range band in the chart. Changing the normal ranges may change the number of inliers and the inlier count to the left of the chart will update based on your selections.

View Visits Without Data

Users can select the checkbox to view visits that do not contain data. Checking the box will show a timepoint for the visit. Unchecking the checkbox will hide the timepoint for visits without data; visits without data are hidden on default.

View Unscheduled Visits

Users can select the checkbox to view data that is not associated with a scheduled visit. Checking the box will show a timepoint for the unscheduled visit and its associated data. Unselecting the checkbox will hide the unscheduled visit timepoint and its data; unscheduled visits are hidden on default.

Custom Filters

The Paneled Outlier Explorer gives users the option to add custom filters. Users can specify a variable they would like to filter by within the settings object, and the chart will allow users to filter by that variable. This option allows further customization and additional filters do not appear by default unless a user or project team requests them.

Filter by Measure

This menu is used to filter the lab variable that is displayed in the chart. The default measure is set to display all variables in the data set, but users can uncheck the "Measures" box to remove all measures and their associated charts from view. Users can also use the check boxes to select or unselect any individual pre-defined measure in this filter. Checking a measure's box will display a chart associated with that measure. Unchecking a measure's box will remove its associated chart from view.

Chart Title

A title will appear at the top of each chart for all measures in view. The title contains the name of the measure, its short name (if applicable), and the units it is measured in.

Resize Chart Buttons

When users hover over a chart a "+" button displays to the right of the chart's title, which allows users to enlarge the chart. Charts are automatically rendered in a smaller uniform size, but users may opt to make them larger to see the chart in more detail. Once a chart has been enlarged, users can select the "-" button to return the chart to its original size.

Hide Button

When users hover over a chart, an "x" button appears, but the option will disappear once users move the mouse off of a chart. Clicking the button will hide the chart from view and unselect its box from the controls menu. Users much reselect it in the controls menu to view it again.

Normal Ranges

This feature highlights the normal ranges for a measure by displaying a green rectangle behind the data. This rectangle represents the normal range for each measure and data that falls within the upper and lower limits of the range contains records of participants who are associated with results that are considered normal.

Brushing to Highlight Data

Clicking an area and dragging the mouse to encompass a data point will highlight the selected point using an orange line. The selected data point will be highlighted in all of the measure charts in view and in the data listing. When a user clicks outside of the selected data point, the orange line disappears along with the detailed listing.

Data Listing

The data listing tab takes the user to another screen to view the underlying data records in the paneled outlier explorer.

Pagination

If the data doesn't fit on the initial page, then pagination options appear at the bottom right corner. Each page defaults to show 10 records, so the pagination allows users to explore more data records than what is presented on the default page. This feature can be turned on/off by configuring the chart settings.

Search box

The detailed view allows the user to search for a specific term to locate it in the data. To initiate this feature, users can type text into the box and the entry automatically searches through the data listing and displays results with matching text. The number of records displayed is shown to the right of the search box. To return to the default data display, the user can click in the search box and delete the entered text. The search feature can be turned on/off by configuring the chart settings.

Sort using Column Header

Users can click on a column header and sort the data within a column in ascending and descending order. The first time a user clicks the column header, the column is sorted in ascending order and a box appears above the data listing containing the variable name that has been selected and an arrow indicating the direction of the ordered data. When a user clicks the column header a second time, the data will be sorted in descending order and the direction of the arrow in the box above the data listing will change to match the new sort. Clicking on the red 'x' within the box containing the variable name both removes the sorting and closes the box. The sort feature can be turned on/off by configuring the chart settings.

Export Data

Users can download the data as a CSV by clicking on the 'CSV' button located underneath the chart within the detailed view. The CSV file will contain all of the data if no filters have been utilized. If filters have been used, the CSV file will contain the resulting data. The file will also capture any sorting that has been initialized in the data. The CSV download will be named using the following convention: webchartsTableExport, date, and time. This feature can be turned on/off by configuring the chart settings.

Regression Tests

Controls

  • Confirm changing the input on the x-axis filter changes the x-axis for the visible charts
  • Confirm that checking the "Visits without data" checkbox shows a timepoint for visits with no associated data points
  • Confirm that unchecking the "Visits without data" checkbox hides the timepoint for visits with no associated data points
  • Confirm that checking the "Unscheduled visits" checkbox shows a timepont for unscheduled visits and their associated data
  • Confirm that unchecking the "Unscheduled visits" checkbox hides the timepoint for unscheduled visits and their associated data
  • Confirm that checking the "Normal range inliers" checkbox displays participants in each chart without values outside the normal range
  • Confirm that unchecking the "Normal range inliers" checkbox hides participants in each chart without values outside the normal range
  • Confirm that selecting "None" from the "Normal range method" dropdown removes the normal ranges from the chart
  • Confirm that selecting "LLN-ULN" from the "Normal range method" dropdown applies normal ranges based on the high and low range values in the data
  • Confirm that selecting "Standard Deviation" from the "Normal range method" dropdown displays an option for users to input a custom number of standard deviations
  • Confirm that entering a value into the "Number of standard deviations" field changes the normal ranges in the chart
  • Confirm that selecting "Quantiles" from the "Normal range method" dropdown displays an option for users to input a custom lower and upper quantile
  • Confirm that entering a value into the "Lower quantile" field changes the lower end of the normal range in the chart
  • Confirm that entering a value into the "Upper quantile" field changes the upper end of the normal range in the chart
  • Confirm the following settings renders custom filters: {"filters": ["SITEID", "SEX", "ARM"]}
  • Confirm unchecking the “Measures” box removes all measures and visible charts
  • Confirm checking the “Measures” box adds all measures and corresponding charts
  • Confirm checking a measure’s box will show a chart corresponding to that measure
  • Confirm unchecking a measure’s box will remove the chart corresponding to that measure

Charts

  • Confirm chart titles contain name of measure and units it is measured in
  • Confirm that when the "Normal range inliers" checkbox is unchecked, a box in the lower left of each chart displaying the number of inliers for that measure
  • Confirm that when the "Normal range inliers" checkbox is checked, the box in the lower left of each chart displaying the number of inliers for that measure disappears
  • Confirm hovering over a chart displays a “+” maximize button
  • Confirm clicking on the maximize button enlarges the chart
  • Confirm hovering over a maximized chart displays a “-“minimize button
  • Confirm clicking on the minimize button minimizes the chart
  • Confirm hovering over a chart displays an “x” remove button
  • Confirm clicking on the remove button removes the chart from view
  • Confirm removing the chart also means the chart title is unselected in the controls menu
  • Confirm reselecting chart in controls menu returns chart to view
  • Confirm normal ranges are displayed in a green rectangle on each visible chart
  • Confirm clicking and dragging the mouse to encompass a data point highlights selected points with an orange line
  • Confirm selected data points are highlighted in orange in all visible charts
  • Confirm selected data points are highlighted in orange in the data listing

Data Listing

  • Confirm selecting the data listing tab displays another screen with data records
  • Confirm the bottom of the data listing tab has pagination links
  • Confirm each default page displays 10 records
  • Confirm “>” pagination arrows link data records to the next page
  • Confirm “<” pagination arrows link data records to the previous page
  • Confirm pagination “>>” double arrows link data to the last pages of the data record
  • Confirm pagination “<<” double arrows link data to the first pages of the data record
  • Confirm that Search works to filter the data displayed in the listing
  • Confirm that Sort works in the listing by clicking on column headers
  • Confirm that you can export the displayed data to a csv via via the Export: CSV button