Use URL Parameters to Modify CODAP's Behavior

URL parameters can be added to a CODAP URL to alter how CODAP is rendered, to pre-load content, or to affect behavior of some components.

Some URL parameters are described below, with examples of links included, as well as iframe embed codes in cases where it may be especially useful to embed CODAP with URL parameters in a website. Information on additional URL parameters can be found here.


COMPONENT MODE

Component mode displays a CODAP document without the tool bar or file manager bar. Undo/redo buttons will be added to each component (graph/table/map).

To turn on component mode, add ?componentMode=yes to the URL.

Here is an example of a shared view CODAP link with the component mode parameter added: https://codap.concord.org/app/static/dg/en/cert/index.html?componentMode=yes#shared=https%3A%2F%2Fcfm-shared.concord.org%2F4nFkIp6kxJkOi2TLsysv%2Ffile.json

Here is the same shared view link in an iframe embed code (yellow highlighting indicates the added component mode parameter), with the embedded iframe shown below: 


EMBEDDED MODE

Embedded mode is similar to component mode, except you can drag the components to move them around on the page (try dragging the graph below to the right).

To turn on embedded mode, add ?embeddedMode=yes to the URL.

Here is an example of a shared view CODAP link with the embedded mode parameter added: https://codap.concord.org/app/static/dg/en/cert/index.html?embeddedMode=yes#shared=https%3A%2F%2Fcfm-shared.concord.org%2F4nFkIp6kxJkOi2TLsysv%2Ffile.json

Here is the same shared view link in an iframe embed code (yellow highlighting indicates the embedded mode parameter), with the embedded iframe shown below:


INBOUNDS

The inbounds URL parameter ensures that any components displayed stay completely within the boundaries of the display. This can be useful in combination with embedded mode, as embedded mode without inbounds allows one to drag components out of visible view. Try dragging around the graph below to see inbounds in effect, and note that unlike the example above, you cannot drag any portion of the graph outside of the boundaries of the iframe.

To turn on inbounds, add ?inbounds=true to the URL.

Here is an example of a shared view CODAP link with the inbounds AND embedded mode parameters added: https://codap.concord.org/app/static/dg/en/cert/index.html?inbounds=true&embeddedMode=yes#shared=https%3A%2F%2Fcfm-shared.concord.org%2F4nFkIp6kxJkOi2TLsysv%2Ffile.json

Here is the same shared view link in an iframe embed code (yellow highlighting indicates the inbounds and embedded mode parameters), with the embedded iframe shown below:


DI

di is a URL parameter that opens CODAP with a specified plugin (or "data interactive") added to the document. To use the di parameter, add ?di=[URL for plugin] to the URL. You can find a list of CODAP plugins here. Note that unlike the previously discussed URL parameters, the di= parameter is not intended to be used with a shared view document, only to open the plugin in a new CODAP document (in other words, if the di= parameter is added to a URL, it should not have #shared= following the URL parameter(s)). However, the di= parameter can be combined with other URL parameters.

Here is an example of a link to open CODAP with the sampler plugin added, in embedded mode: https://codap.concord.org/app/static/dg/en/cert/index.html?di=https://concord-consortium.github.io/codap-data-interactives/TP-Sampler/index.html&embeddedMode=yes


APP=IS

app=is is a URL parameter that opens CODAP with parent visibility toggles added to the components (graphs or maps). While it is possible to manually add parent visibility toggles to a component in CODAP, an advantage of the app=is URL parameter is it makes it so any new components created will automatically have the parent visibility toggles added (try creating a new graph in the example below to see this).

Here is an example of a shared view link with the app=is parameter added: https://codap.concord.org/app/static/dg/en/cert/index.html?app=is#shared=https%3A%2F%2Fcfm-shared.concord.org%2FjsoCncL16va8DDIMKXok%2Ffile.json


URL

url= is a parameter that opens a URL that follows url= within CODAP. This can be especially useful for opening a link to a data file (such as a URL for a CSV file) as a table within CODAP. In this case, each time the URL with the added url= parameter is opened, the data is imported directly from its source. This could be useful for a regularly updated source of data if you want to open it in CODAP with the most up-to-date data included. Note that like the di= parameter, url= is not intended to be used with a shared view document, only to open the URL that follows url= in a new CODAP document (so the URL should not have #shared= following the URL parameter(s)). Note also that sometimes url= will fail to open the URL following the parameter, due to restrictions imposed by the source.

Here is an example of a CODAP link with the url= parameter added for the purposes of importing this datasethttps://codap.concord.org/releases/latest/static/dg/en/cert/index.html?url=https://data.cdc.gov/api/views/f3a8-hmpp/rows.csv


For all URL parameters, it is important to remember the following: 

The ? followed by the parameter must go before the # in the URL, if present (or, if there is no # in the URL, put the ? plus the parameter(s) at the end of the URL. Multiple parameters may be joined by &, for example: ?parameter1&parameter2 . Note that parameters are case sensitive.

Here is a link to a page with more information on URL parameters in CODAP (includes info on some additional URL parameters not discussed above).

Was this Article Useful?