Menu
Content Services

Options Widget

Options widget retrieves a list of options available for an option prefix (root and maturity).

Installation

script

Example

                              window.dtn.futures.createOptionsWidget({
 


                                
});
                              
                            

Types

FuturesSymbol

type FuturesSymbol = string;

This type describe futures symbol data that may be used to supply the symbol property.

OptionPrefix

type OptionPrefix = string;

This type describe futures symbol data that may be used to supply the symbol property.

PriceFormat

type PriceFormat = "DECIMAL" | "TICK" = "TICK";

This type describes the format of the prices that may be used to supply the priceFormat property.

VisibleField

type VisibleField = { key: string, subFields?: string[] }

This type describes all the available fields for customizing what data is shown in the table.

Configuration

apiKey

apiKey: string;

The widget access api key associated with your DTN account.

container

container: HTMLElement | string;

The container to mount the widget on. This can be a reference to an HTML element, or a valid selector string. If a string is encountered, document.querySelector will be used to search document for the container.

symbol

symbol: FuturesSymbol;

The futures symbol to search for commodities included on the commodity options dropdown picker. Defaults to all CORN, SOYBEANS, and WHEAT contracts.

priceFormat

priceFormat: PriceFormat = "DECIMAL";

Determines the format of the prices when returned. Decimal will provide regular decimal values, Tick will provide fractional values as associated with the commodity root. Default set to "DECIMAL".

initialCommodity

initialCommodity: OptionPrefix;

The initial commodity option symbol to display on widget load.

visibleFields

visibleFields = VisibleField[];

This options allows you to customize what fields are displayed in the options tables. This is also responsible for defining the order of the columns in the table.

displaySetting

displaySetting?: "ALL" | "OPEN_ONLY" = "OPEN_ONLY";

The display setting option controls which display is set by default. "ALL", will show all options details. "OPEN_ONLY", the default, will include strike prices with open interest.

view

view?: "STRIKE" | "SIDE_BY_SIDE" = "SIDE_BY_SIDE";

The view option controls which view is active by default. "SIDE_BY_SIDE", the default, will show call and put details side by side. "STRIKE" will show the CALL and PUT on their own tables.

layout

layout?: "NORMAL" | "COMPACT" = "NORMAL";

The layout view option controls the layout view of the table. "NORMAL", the default, will show all fields on the table. "COMPACT" will include premium and change fields only.

Methods

setSymbol

setSymbol: (
  symbol: OptionPrefix, priceFormat: PriceFormat
) => void;

Set a new option prefix to populate the options data table.

Callbacks

onOptionSelect

onOptionSelect: (tickerSymbol: OptionPrefix) => void;

This callback will be called whenever the option button is clicked.