Table 1
Chart Foundry Lifecycle.
| Order | Phase | Description |
|---|---|---|
| 1 | Chart Creation | Chart Object is created and returned via the createChart() method. |
| 2 | Initialization | The init() methods establishes default settings, binds data to the chart, and triggers the remaining steps in the life-cycle. |
| 3 | Layout | An svg is added to the DOM along with placeholder chart components (e.g. axes). |
| 4 | Draw | Raw data is processed as needed for charting. Pre-processing steps are completed (e.g. Scales are calculated.) |
| 5 | Resize | All chart marks are rendered/updated. |
Figure 1
Simple Dashboard with Controls – This study monitoring dashboard shows common study metrics such as enrollment status, visit completion, and specimen and case report form status. The dashboard combines 6 different chart objects, several of which have attached controls, allowing users to filter by site and change the y-axis from a relative value to an absolute count. A simple callback function is used in the top left chart to customize the legend with overall counts and provide details for the y-axis in a tooltip. An interactive version of this chart, along with the source code, is available at: http://bl.ocks.org/jwildfire/raw/80890e1ff7bdc7f43079/.
Figure 2
Panel A – Adverse Event Timeline – Overview. Panel B – Adverse Event Timeline – Participant Details – This figure combines 2 chart objects, a table object, and a control object, along with several custom callbacks to show the pattern of adverse events in a clinical trial. Panel A shows the pattern of adverse events over time for all participants. Panel B is triggered by clicking on a participant ID (shown as a label on the y-axis), and presents a detailed listing of adverse events for a single individual. While there are no dependencies other than Webcharts and d3.js, the code to produce this chart has also been saved as a separate library to facilitate re-usability. An interactive version of this chart along with the source code is available at: https://bl.ocks.org/jwildfire/raw/9865b8e7761f28a8a1557622d93ffbde/. The stand-alone Adverse Event Timeline library is at: https://github.com/RhoInc/ae-timelines.
Figure 3
Immunologic Outcome explorer – This display is adapted from Figure 3 in the New England Journal of Medicine article, Randomized Trial of Peanut Consumption in Infants at Risk for Peanut Allergy [17]. The chart was originally created in response to reader correspondence [18], and was later updated to include follow up data in conjunction with a second article, Effect of Avoidance on Peanut Allergy after Early Peanut Consumption [19]. The interactive version allows the user to select from 10 outcomes on the y-axis. Selections for sex, ethnicity, study population, skin prick test stratum, and peanut specific IgE at 60 and 72 months of age can be interactively chosen to filter the data and display subgroups of interest. Figure options (e.g. summary lines, box and violin plots) can be selected under the Overlays heading to alter the properties of the figure. An interactive version of this chart is available at: http://bl.ocks.org/jwildfire/raw/893681c8f49470ee027a/.