Views

concordancer

The concordancer view displays a table of annotations and their cotext annotations. Attributes allow timerange and count limits, to extract only meaningful relative annotations. Configurable display to see each cotext annotation in its own column, or all combined into one clip.

  • show-value bool = true Whether to display the annotation's text value

  • show-video bool = false Whether to display the video clip of the processed annotation

  • show-tier bool = false Whether to display the annotation's tier

  • show-group bool = false Whether to display the annotation's group

  • show-file bool = false Whether to display the annotation's file

  • show-index bool = false Whether to display the index of each row

  • video-with-cotext bool = true Whether to include cotext annotations in the video

  • cotext int = 1 Number of annotations to extract before and after the processed annotation

  • cotext-before int = cotext Number of annotations to extract before the processed annotation

  • cotext-after int = cotext Number of annotations to extract after the processed annotation

  • cotext-video bool = false Whether to display a video for cotext annotations

  • cotext-split bool = false Whether to display each cotext annotation in its own column

  • max-time-diff int = 60 Skip cotext annotations that are out of this range

  • label-before string = Before Label for table header

  • label-pivot string = Pivot Label for table header

  • label-after string = After Label for table header

  • label-index string = Label for table header

  • label-tier string = Tier Label for table header

  • label-group string = Group Label for table header

  • label-file string = File Label for table header

  • label-none string = Label for no matches

Input: Array<Annotation>

view.concordancer.jpg

view.concordancer.split.jpg

controlled-vocabulary

Displays the controlled vocabulary associated to each tier in the input selection

Input: Array<Annotation>

3 🗸3 🕮

density

The density view plots annotations as filled bars in a timeline, revealing interactions frequency and duration between tiers.

  • group bool = false Whether to separate annotations based on their group instead of their file

  • sequence string Separate annotations based on another tier's annotations (used as sequences)

  • time-offset bool = false Whether to use files' time-offset

  • time-collapse number = 0 Number of seconds after which empty space is collapsed (0 = no collpase)

  • zoom-factor int = 100 Milliseconds to pixel factor

  • show-alt-tiers bool = false Whether to display alternative tiers in the main table

  • show-alt-tier-in-empty-cells bool = false Whether to display the alternative tier if the cell is empty

  • show-value-on-hover bool = false Whether to display the annotation value on mouse over

  • show-snap-on-hover bool = false Whether to display the video snapshot on mouse over

  • show-video-on-click bool = false Whether to display the video player on click

  • video-player-width string = 300

  • video-player-height string

🏷 tier="id" name="" parent="" color="" alt-tier="" Customize tier display
🏷 group="id" name="Custom Name" Set a custom header name for each group
🏷 file="id" name="Custom Name" Set a custom header name for each file
🏷 alt-tier="id" label="" css="" Customize alternative tier display and legend
🏷 show-media-on-click-for-tier="id" Show video clips for a specific tier only
🏷 show-snap-on-hover-for-tier="id" Show snap for a specific tier only

Input: Array<Annotation>

view.density.png

6 🕮

density-timeline 🧪

The density timeline plots annotations as filled bars horizontally, revealing interactions frequency and duration between tiers. Flexible time collapsing options allow compacting empty space between annotations. Currently not compatible with alt-tiers.

  • group bool = false Whether to separate annotations based on their group instead of their file

  • sequence tier Separate annotations based on another tier's annotations (used as sequences)

  • relate-to-corpus bool = false Whether to show the whole corpus regardless of input selection

  • time-offset bool = false Whether to use files' time-offset

  • time-between bool = false Whether to show the time between separators

  • time-collapse-threshold number = 0 Number of seconds after which empty space is collapsed (0 = no collpase)

  • time-collapse-display string = show-duration How the collapsed zone should look(show-duration, short, compact, dense, minimum, none)

  • time-collapse-alt-display string = compact How the collapsed zone should look if it collapsed less than alt-display-threshold(show-duration, short, compact, dense, minimum, none)

  • time-collapse-alt-display-threshold number = 0 Number of seconds collapsed before which alt-display is used

  • time-collapse-hide-first-start bool = false Whether to hide the first (starting) collapse, if any

  • time-collapse-hide-each-start bool = false Whether to hide the first (starting) collapse of each group/column, if any

  • time-collapse-hide-each-last bool = false Whether to hide the last collapse of each group/column, if any

  • time-collapse-hide-borders bool = false Whether to hide the left and right borders of collapsed zones

  • time-collapse-absolute-start bool = false Whether to show the duration of the first collapse of each group, as an absolute duration (relative to corpus beginning when time-offset is active)

  • time-collapse-debug bool = false Whether to show the debug info of collapses

  • zoom-factor int = 100 Milliseconds to pixel factor (how many milliseconds one pixel will represent)

  • color-values bool = false Whether to use CSS for specific values, colors defined in Style or as parameters

  • color-values-opacity bool = false Whether to toggle the opacity of the colored values

  • show-alt-tiers-in-table bool = false Whether to display alternative tiers in the main table

  • show-alt-tier-in-empty-cells bool = false Whether to display the alternative tier if the cell is empty

  • show-value-on-hover bool = false Whether to display the annotation value on mouse over

  • show-snap-on-hover bool = false Whether to display the media snapshot on mouse over

  • show-media-on-click bool = false Whether to display the media player on click

  • video-player-width string = 300

  • video-player-height string

🏷 tier="id" name="" parent="" color="" alt-tier="" Customize tier display
🏷 group="id" name="Custom Name" Set a custom header name for each group
🏷 file="id" name="Custom Name" Set a custom header name for each file
🏷 alt-tier="id" label="" css="" Customize alternative tier display and legend
🏷 value="value" label="" color="" css="" Customize specific value display and legend
🏷 show-media-on-click-for-tier="id" Show video clips for a specific tier only
🏷 show-snap-on-hover-for-tier="id" Show snap for a specific tier only

Input: Array<Annotation>

view.density-timeline.png

form

The form view renders HTML input forms, allowing easy online sharing for collecting external data. Form results are simple JSON files which can then be imported back as virtual tiers for further analysis.

  • show-header bool = false Whether to display table header

  • show-index bool = true Whether to display index column

  • show-value bool = true Whether to display annotation's text value

  • show-video bool = true Whether to display annotation's video clip

  • show-tier bool = true Whether to display tier's name

  • show-file bool = false Whether to display annotation file name

  • cotext int = 0 Number of cotext annotations to show before and after (0 = no cotext)

  • cotext-range number = 0 Max number of seconds to consider a neighbor annotation as a valid cotext annotation (0 = no limit)

  • cotext-media bool = false Whether to extend the clip to include the cotext annotations (make sure to use a reasonable cotext-range to avoid super long clips)

  • extend-duration number = 0 Number of seconds to add before and after when cutting the clip

  • label-save string = SAVE Save button label

  • name string a name to identify this form, will be used as filename and accept field parameters interpolation

🏷 dimension="name" label="label" cv="controlled vocabulary id"
🏷 dimension="name" label="label" choices="list,of,choices"
🏷 dimension="name" label="label" type="text"
🏷 field="name" label="label" type="text"

Input: Array<Annotation>

hidden

A special view with no output, for instance to do live queries.

intercoding

The intercoding view makes it easy to process JSON files resulting from forms, and display them in a meaningful way for intercoding validation and statistics.

  • reference tier The tier used as reference, if any.

  • show-video bool = true Whether to display the annotation's video clip

  • show-index bool = true Whether to display the index

  • show-start bool = false Whether to display the start timecode

  • values-replacement js A JSON object used to replace a given value with another one, like {"a1":"A", "a2":"A"}

  • weight-matrix bool = false Whether to use the weight matrix

  • weight-matrix-values matrix A custom matrix defining the weight of each values' pair

  • weight-matrix-func js A custom JS function that should return the weight for a given pair provided as arguments, like (a,b) => a==b ? 1 : 0

  • save-weight-matrix-csv string Name of a CSV file to export the weight matrix

  • save-coincidence-matrix-csv string Name of a CSV file to export the coincidence matrix

  • save-krippendorff-alpha-json string Name of a JSON file to export Krippendorff's alpha, as {"alpha":X}

  • save-krippendorff-alpha-variable string Name of a variable to save Krippendorff's alpha to

🏷 column="tier id" name="" Set custom column order and header names
🏷 exclude-tag="tag" Exclude from the intercoding calculations all annotations that have this tag
🏷 name-of-tier="id" name="Custom Name" Set a custom header name for each tier
🏷 name-of-group="id" name="Custom Name" Set a custom header name for each group
🏷 name-of-file="id" name="Custom Name" Set a custom header name for each file
🏷 stat="score" name="Score (Points)" Add a stat column (score alone)
🏷 stat="score%" name="Score (Percentage)" Add a stat column (score percentage)
🏷 stat="score/" name="Score (Points/Total)" Add a stat column (score on total)
🏷 stat="count" name="Similarity percentage count" Add a stat column
🏷 stat="weight-matrix" name="Weight Matrix" Show the weight matrix
🏷 stat="coincidence-matrix" name="Coincidence Matrix" Show the coincidence matrix
🏷 stat="krippendorff-alpha" name="Krippendorff's Alpha" Show Krippendorff's Alpha

Input: Array<Annotation>

view.intercoding.png

json

Displays JSON serializable data as an interactive tree.

Input: Object
Input: Array

view.json.png

3 🕮

list

The list view simply renders annotations one after another. It is possible to specify a custom class for switching display to grid mode.

  • show-value bool = true Whether to display annotation's text value

  • show-media bool = true Whether to display annotation's media clip

  • show-snap bool = false Whether to display annotation's snapshot

  • show-tier bool = true Whether to display tier's name

  • class string = list Alternative display style(list, grid)

  • file-header html Raw html to insert as a header before each file

  • file-separator html Raw html to insert as a separator between each file

  • file-footer html Raw html to insert as a footer after each file

🏷 file="" name="" Set a custom name for each file

Input: Array<Annotation>

view.list.grid.jpg

1 🗸3 🕮

table

The table view can display various annotations' (or objects) properties into table columns. It also supports the Extra protocol allowing user-defined properties to be displayed as columns.

  • header-name-replace js A custom function to replace the columns header name

  • export-to-csv string Specify a file name to export the table content to CSV

🏷 column="index" name="Index"
🏷 column="tier" name="Tier"
🏷 column="value" name="Annotation Value"
🏷 column="video" name="Video"
🏷 column="snap" name="Snapshot"
🏷 column="start" name="Start timecode"
🏷 column="stop" name="Stop timecode"
🏷 column="group" name="Group"
🏷 column="participant" name="Participant"
🏷 column="file" name="File"
🏷 column="extra" extra-id="" name="" as="[value,video]"
🏷 column="property" property="" name="" as="[text,link]"

Input: Array<Annotation>
Input: Array<Object>

15 🗸

testcase

A special view to display testcase results.

tiers

Displays tiers of all the annotation files linked to the input selection

  • sort-by select (name) Sort the table(name, total-tiers, total-annotations)

Input: Array<Annotation>

view.tiers.png

1 🗸3 🕮

timeline

The timeline view displays annotations vertically with time markers, and using one column per tier. Ideal for dialogs between 2+ participants.

  • collapse int = 60 Max number of seconds between 2 annotations beyond which a separator indicating collapsed duration is displayed

  • show-value bool = true Whether to display the annotation's text value

  • show-video bool = true Whether to display the annotation's video clip

  • show-timestamp bool = true Whether to display the timestamp

  • group bool = false Whether to separate annotations based on their group instead of their file

  • sequence string Separate annotations based on another tier's annotations (used as sequences)

🏷 tier="id" name="Custom Name" Set a custom header name for each tier
🏷 group="id" name="Custom Name" Set a custom header name for each group
🏷 file="id" name="Custom Name" Set a custom header name for each file
🏷 column="tier id" Set a custom order for each tier

Input: Array<Annotation>

view.timeline.jpg

transcript

Displays annotations as a simple transcript, can also export transcript to CSV files.

  • style select = monospace The layout to use(monospace, fluid)

  • separator string = : The separator to use between the tier name and the text

  • max-line-width int = 0 Maximum number of characters in one line of text (0 = disabled)

  • min-tier-width int = 0 Minimum width (in characters) of the tier column

  • export-to-csv bool = false Whether to also export a CSV file of each transcript

Input: Array<Annotation>

view.transcript.png

wordcloud

The wordcloud helps visualize frequency of words and has many customisation attributes. Wordcloud can slow down PDF generation time and can take some time to show-up.

  • length-threshold int = 3 Exclude words with less than length-threshold letters

  • frequency-threshold int = 0 Exclude words with a lower frequency

  • size-factor int = 0 The size factor to draw words (0 = auto)

  • min-size int = 0 (0 to disable)

  • weight-factor number = 1

  • font-family string

  • font-weight string = normal

  • color string = random-dark

  • background-color string = #fff

  • draw-out-of-bound bool = false

  • shrink-to-fit bool = false

  • origin array origin of the “cloud” in [x, y]

  • min-rotation number = -Math.PI / 2

  • max-rotation number = Math.PI / 2

  • rotation-steps number = 0

  • rotate-ratio number = 0.1

  • shape string = circle (circle, cardioid, diamond, square, triangle-forward, triangle, pentagon, star)

  • ellipticity number = 0.65

  • shuffle bool = true

  • list-words int = 0 How many words to show in a table, 0 to disable

Input: Array<Annotation>
Input: Array<Array> (an array of ["word", weight] pairs)

view.wordcloud.png

🗀 MIT LicenseWordcloud2 by Timothy Guan-tin Chien and contributors 🔗