The charts and information displays follow the RAMADDA wiki tag format:

{{display_<display type>  <name=value pairs>}}

Each of these tags support the following attributes:

layoutHere="true"  
showMenu="true"  
showTitle="true"
title="Title to display"

If layoutHere is set to false then the component is laid out by the container group (below). Otherwise it is displayed in place.

The data comes from some entry on RAMADDA. This entry can be specified with the entry attribute:

{{display_linechart entry="some other entry id"}}

The data can also come form an entry on a different RAMADDA using the remote attribute:

{{display_linechart remote="https://ramadda.org/repository/entry/show?entryid=0c4338b6-1469-48ec-88b4-406f61621420"}}

The data that is displayed takes the form of a number of records where each record is composed of the same number of fields. Optionally, records can also have a latitude/longitude position and a date associated with them. The data for an entry is a JSON format and is accessed via the URL, e.g.:
https://ramadda.org/repository/entry/data?entryid=0c4338b6-1469-48ec-88b4-406f61621420

The total number of records fetched from the server can be set with the "max" attribute. This will only retrieve the first N records. So, for example if you have a dataset with lots of records (e.g., 20000) you can display them all (e.g., in a line chart) with:

{{display_linechart max=20000}}

If you have a number of displays on one page that you want to apply the same max value for then use:

{{property max=20000}}
{{display_linechart}}
{{display_table}}      	

You can specify a stride with the "skip" attribute. For example if you want to fetch every other record do:

{{display_linechart skip=1}}

Every 10th record do:

{{display_linechart skip=10}}

If you only wanted the last N records specify, e.g.:

{{display_linechart lastRecords=10}}

You can also specify a start and end date range with:

{{display_linechart startDate="yyyy-MM-dd HH:mm" endDate="yyyy-MM-dd HH:mm"}}

e.g.:

{{display_linechart startDate="2021-01-01"}}

The startDate and endDate can also be relative to the current date. For example, if you wanted to get the last week's data you would do:

{{display_linechart startDate="-1 week"}}

In general the relative dates take the form:

<offset> <dateunit>
where:
dateunit=second|minute|hour|day|week|month|year|century|millenium

For example:

{{display_linechart startDate="-13 days" endDate="-5 days"}}

Most of these displays are based on point data in RAMADDA. The point data model is based on a series of records (or rows) that are made up of a set of fields (or columns). Each field has a certain type - double, integer, string, date. Many of the displays below use a fields attribute to specify the fields that are displayed. These are either the field ids of the point data or a 1-based index into the field list.

fields="active_voters,total_ballots"
Or:
fields="1,#2,#3"

The field ids for a point data entry can be viewed with the Metadata view, e.g. - (example).

{{display_linechart fields="#5,#6,#7,#8,#9,#10" }}

A display can present a set of widgets that allow the user to filter the data being shown. For example, in the image below (See here) the data has a set of fields - elev, elev_gain, distance, range and class. Below is the wiki text that creates the above display. The map display defines which fields should be used with the filterFields="..." attribute. The ranking display specifies the same set of filter fields but also has a hideFilterWidget=true which specifies to actually not show the widgets. The filter values the user enters in the map display are then applied to the ranking display.

+row
+col-3
{{display  type="ranking"  
...
filterFields="elev,elev_gain,distance,range,class" hideFilterWidget=true
 }} 
 -col
 +col-9
{{display  type="map"  
...
filterFields="elev,elev_gain,distance,class,range"
}} 
 -col
 -row

Filter attributes:

• filterFields="field1,field2"
  The fields to filter on
• hideFilterWidget=true
  Don't show the filter widgets.
• <field_name>.filterValue="some value"
  Specify an initial filter value
• <field_name>.includeAll="false"
  For enumerated values a menu of items is shown. To not have the "All" value add a attribute.
• <field_name>.filterMultiple="true"
  Support multiple values to filter on
• <field_name>.filterMultipleSize="5"
  How big a selection menu to show
• <field_name>.filterValues="value1,value2,.."
  Specify values to use in the filter menu instead of the values in the data
• <field_name>.filterValueMin="min value", <field_name>.filterValueMax="max value"
  Use these to specify initial values for numeric fields.
• <field_name>.filterLabel="some label"
  Specify an alternative label to display with the filter widget
• <field_name>.filterPrefix="some prefix", <field_name>.filterSuffix="some suffix"
  Specify extra text to wrap the filter value

convertData="command1;command2;...;"

Where commands can be:
  derived(field=field_id, function=some_expression)
e.g.:
  derived(field=poptimes10, function=population*10)

  rotateData(includeFields=true,includeDate=true,flipColumns=true)
  addPercentIncrease(replaceValues=false)

You can specify various filters applied to the data

By date:
startDate="yyyy-MM-dd"
endDate="yyyy-MM-dd"

By value:
dataFilters="command(field=<field id>,value=<value>,enabled=<value>,label=<label>...


Where "command" can be one of:
match - string match
notmatch - string not match
lessthan - <=
greaterthan - >=
equals
notequals


If the label is specified then a selector checkbox will be shown to turn on/off this filter

You can also sample the data with:

stride=1 -  take every other point
maxDisplayedPoints= - if set, then set the stride so we at most have  maxDisplayedPoints points

You can bin the data based on dates with:

binDate=day|week|month|year
binType=total|count|average

Only show unique rows with:

uniqueField=<field id>

RAMADDA provides a large number of built-in color tables. The full set of color tables can be viewed at here. When editing the wiki text if you right-lick inside of a {{display ...}} tag a context menu will be shown that will list the available color tables. Colors are defined and can also be modified the following ways.

colorTable="some color table name" - specify the color table

colorTable="colors:red,green,blue,...."   - explicit list of colors

colorTable.<field name> ="some color table"  - specify a color table for one of the "color by" fields

colorTableInverse="true"   -reverse the colors

colorTableAlpha="0.0 - 1.0" - specify a transparency value

colorBy=<field name> - specify a data field to color by

colorByFields=<field1,field2,...,fieldN> - specify a number of fields to allow the user to choose how to color

There is a group tag that can manage a number of children displays. The general use is of the form below where displays 1-3 are part of group 1 and displays 4,5 are part of group 2. The group allows for different displays to communicate with each other (e.g., creating a new chart, map click, animation, etc), the inheritance of certain attributes (e.g., showMenu, showTitle) and the layout of the children displays. If there is a wiki page that does not have a group but only one or more display tags then a group will be added automatically.

{{group group 1 ...}}
{{display display 1}}
{{display display 2}}
{{display display 3}}
{{group group 2...}}
{{display display 4}}
{{display display 5}}

If showMenu is set to true for a group then the below menu is displayed. This supports the interactive creation of new charts and displays. The layout of these displays can be changed interactively, their state can be changed and they can be deleted. If the user is logged in then the set of dynamically created displays can be saved (e.g., as a wiki page) through the group menu as seen below: Each child display may be located in a fixed location (using layoutHere=false) in the web page or the group can manage the layout of the children displays. Different layouts can be specified with the layoutType attribute. The available layouts are:

layoutType=tabs
layoutType=table
layoutType=columns
layoutType=rows

Using the table layout the number of columns is specified with the layoutColumns attribute. For the columns and rows layout type each child display can specify the column number of row number it should be placed in. For example, for the rows layout if you had:

{{group layoutType="rows"}}
{{display display1  row="1"}}
{{display display2  row="1"}}
{{display display3  row="1"}}
{{display display4  row="2"}}
{{display display5  row="2"}}
{{display display6  row="3"}}

Would result in (without the border):

display1

display2

display3

display4

display5

display6

The divid attribute allows you to specify a div tag that is in the wiki page as the location for the group and the displays to place themselves in. For example, below is the (abbreviated) wiki text used to create this page on ramadda.org. We want to have a fixed layout where the entry list is on the left and the map is on the right. Any charts or other display components that are interactively created by the user are managed by the group and layed out below the list and map. To do this we define a regular html table layout that contains a couple of div tags - one for the list and one for the map. We set the IDs of the div tags and then reference those IDs in the display wiki tags below. Likewise, the group has a divid=maindiv which corresponds to the div at the bottom of the page.

When you have multiple entries you can create a display (e.g., a time series) and allow the user to select which entry to display. Here is an example that shows a time series plot of one of a set of data files: Below is the relevant wiki text for the above display. You can also view the full wiki text here. All that is needed is to add a changeEntries=true attribute to the group tag. An optional changeEntriesLabel can be specified to provide a context specific label. The firstEntry attribute is an optional way of specifying which entry should be shown as the first entry. For the actual displays you should specify an entry that is initially used as well.

{{group  changeEntries=true changeEntriesLabel="Select Region" 
firstEntry="93198426-f87d-40e6-b206-43b25ad1d4fa"  
}}
<table width=100%><tr valign=top><td width=1%>
{{display_fieldslist width=150px
entry=93198426-f87d-40e6-b206-43b25ad1d4fa
fields="#41,#42,#43,#44,#45,#46,#47,#48,#49,#50"
...
}}
</td><td>
{{display_linechart
entry=93198426-f87d-40e6-b206-43b25ad1d4fa
fields="#41,#42,#43,#44,#45,#46,#47,#48,#49,#50"
...
}} 
</tr></table>

The above lists the entries in a menu. Alternatively you can display the entries in a map or in a timeline.