# Module: LocusZoom_DataLayers

Data layers represent instructions for how to render common types of information. (GWAS scatter plot, nearby genes, straight lines and filled curves, etc)

Each rendering type also provides helpful functionality such as filtering, matching, and interactive tooltip display. Predefined layers can be extended or customized, with many configurable options.

Source:
  - components/data_layer/base.js, line 1

### Classes

annotation_track
arcs
BaseDataLayer
category_forest
category_scatter
forest
genes
highlight_regions
intervals
intervals_enrichment
orthogonal_line
scatter

### Type Definitions

#### behavior

##### Type:

- Object

##### Properties:

Name | Type | Description
--- | --- | ---
`action` | 'set' | 'unset' | 'toggle' | 'link' |
`status` | 'highlighted' | 'selected' | 'faded' | 'hidden' | An element display status to set/unset/toggle
`exclusive` | boolean | Whether an element status should be exclusive (eg only allow one point to be selected at a time)
`href` | string | For links, the URL to visit when clicking
`target` | string | For links, the `target` attribute (eg, name of a window or tab in which to open this link)

Source:
  - components/data_layer/base.js, line 37

#### DataOperation

A synchronous function that modifies data returned from adapters, in order to clean up or reformat prior to plotting.

##### Type:

- object

##### Properties:

Name | Type | Attributes | Description
--- | --- | --- | ---
`type` | module:LocusZoom_DataFunctions | 'fetch' |  |
`from` | Array.<String> | <optional> | For operations of type "fetch", this is required. By default, it will fill in any items provided in "namespace" (everything specified in namespace triggers an adapter/network request) A namespace should be manually specified in this array when there are dependencies (one request depends on the content of what is returned from another namespace). Eg, for ld to be fetched after association data, specify "ld(assoc)". Most LocusZoom examples fill in all items, in order to make the examples more clear.
`name` | String | <optional> | The name of this operation. This only needs to be specified if a data layer performs several operations, and needs to refer to the result of a prior operation. Eg, if the retrieved data is combined via several left joins in series: `name: "assoc_plus_ld"` -> feeds into `{name: "final", requires: ["assoc_plus_ld"]}`
`requires` | Array.<String> |  | The names of each adapter required. This does not need to specify dependencies, just the names of other namespaces (or data operations) whose results must be available before a join can be performed
`params` | Array.<String> |  | Any user-defined parameters that should be passed to the particular join function (see: module:LocusZoom_DataFunctions for details). For example, this could specify the left and right key fields for a join function, based on the expected field names used in this data layer: `params: ['assoc:position', 'ld:position2']` Separate from this section, data functions will also receive a copy of "plot.state" automatically.

Source:
  - components/data_layer/base.js, line 55

#### FilterOption

##### Type:

- object

##### Properties:

Name | Type | Description
--- | --- | ---
`field` | string | The name of a field found within each datapoint datum
`operator` | module:LocusZoom_MatchFunctions | The name of a comparison function to use when deciding if the field satisfies this filter
`value` |  | The target value to compare to

Source:
  - components/data_layer/base.js, line 47

#### LegendItem

##### Type:

- object

##### Properties:

Name | Type | Attributes | Default | Description
--- | --- | --- | --- | ---
`shape` |  | <optional> |  | This is optional (e.g. a legend element could just be a textual label). Supported values are the standard d3 3.x symbol types (i.e. "circle", "cross", "diamond", "square", "triangle-down", and "triangle-up"), as well as "rect" for an arbitrary square/rectangle or "line" for a path. A special "ribbon" option can be use to draw a series of explicit, numeric-only color stops (a row of colored squares, such as to indicate LD)
`color` | string |  |  | The point color (hexadecimal, rgb, etc)
`label` | string |  |  | The human-readable label of the legend item
`class` | string | <optional> |  | The name of a CSS class used to style the point in the legend
`size` | number | <optional> |  | The point area for each element (if the shape is a d3 symbol). Eg, for a 40 px area, a circle would be ~7..14 px in diameter.
`length` | number | <optional> |  | Length (in pixels) for the path rendered as the graphical portion of the legend element if the value of the shape parameter is "line".
`width` | number | <optional> |  | Width (in pixels) for the rect rendered as the graphical portion of the legend element if the value of the shape parameter is "rect" or "ribbon".
`height` | number | <optional> |  | Height (in pixels) for the rect rendered as the graphical portion of the legend element if the value of the shape parameter is "rect" or "ribbon".
`orientation` | 'vertical' | 'horizontal' | <optional> | 'vertical' | For shape "ribbon", specifies whether to draw the ribbon vertically or horizontally.
`tick_labels` | Array | <optional> |  | For shape "ribbon", specifies the tick labels that correspond to each colorstop value. Tick labels appear at all box edges: this array should have 1 more item than the number of colorstops.
`color_stops` | Array.<String> | <optional> |  | For shape "ribbon", specifies the colors of each box in the row of colored squares. There should be 1 fewer item in color_stops than the number of tick labels.
`style` | object |  |  | CSS styles object to be applied to the DOM element representing the graphical portion of the legend element.

Source:
  - components/data_layer/base.js, line 71

#### ScalableParameter

"Scalable" parameters indicate that a datum can be rendered in custom ways based on its value. (color, size, shape, etc)

This means that if the value of this property is a scalar, it is used directly (`color: '#FF0000'`). But if the value is an array of options, each will be evaluated in turn until the first non-null result is found. The syntax below describes how each member of the array should specify the field and scale function to be used. Often, the last item in the list is a string, providing a "default" value if all scale functions evaluate to null.

##### Type:

- Array.<object> | string

##### Properties:

Name | Type | Attributes | Description
--- | --- | --- | ---
`field` | string | <optional> | The name of the field to use in the scale function. If omitted, all fields for the given datum element will be passed to the scale function.
`scale_function` | module:LocusZoom_ScaleFunctions |  | The name of a scale function that will be run on each individual datum
`parameters` | object |  | A set of parameters that configure the desired scale function (options vary by function)

Source:
  - components/data_layer/base.js, line 21