/* * * Wijmo Library 5.20183.567 * http://wijmo.com/ * * Copyright(c) GrapeCity, Inc. All rights reserved. * * Licensed under the GrapeCity Commercial License. * sales@wijmo.com * wijmo.com/products/wijmo-5/license/ * */ declare module wijmo { module meta { class ControlMetaFactory { static CreateProp(propertyName: string, propertyType: PropertyType, changeEvent?: string, enumType?: any, isNativeControlProperty?: boolean, priority?: number): PropDescBase; static CreateEvent(eventName: string, isPropChanged?: boolean): EventDescBase; static CreateComplexProp(propertyName: string, isArray: boolean, ownsObject?: boolean): ComplexPropDescBase; static findProp(propName: string, props: PropDescBase[]): PropDescBase; static findEvent(eventName: string, events: EventDescBase[]): EventDescBase; static findComplexProp(propName: string, props: ComplexPropDescBase[]): ComplexPropDescBase; static getMetaData(metaDataId: any): MetaDataBase; static getClassName(classRef: any): string; static toCamelCase(s: any): any; private static findInArr(arr, propName, value); } class PropDescBase { private _propertyName; private _propertyType; private _changeEvent; private _enumType; private _isNativeControlProperty; private _priority; constructor(propertyName: string, propertyType: PropertyType, changeEvent?: string, enumType?: any, isNativeControlProperty?: boolean, priority?: number); readonly propertyName: string; readonly propertyType: PropertyType; readonly changeEvent: string; readonly enumType: any; readonly bindingMode: BindingMode; readonly isNativeControlProperty: boolean; readonly priority: number; readonly shouldUpdateSource: boolean; initialize(options: any): void; castValueToType(value: any): any; private _parseDate(value); } enum PropertyType { Boolean = 0, Number = 1, Date = 2, String = 3, AnyPrimitive = 4, Enum = 5, Function = 6, EventHandler = 7, Any = 8, } function isSimpleType(type: PropertyType): boolean; enum BindingMode { OneWay = 0, TwoWay = 1, } class EventDescBase { private _eventName; private _isPropChanged; constructor(eventName: string, isPropChanged?: boolean); readonly eventName: string; readonly isPropChanged: boolean; } class ComplexPropDescBase { propertyName: string; isArray: boolean; private _ownsObject; constructor(propertyName: string, isArray: boolean, ownsObject?: boolean); readonly ownsObject: boolean; } class MetaDataBase { private _props; private _events; private _complexProps; parentProperty: string; isParentPropertyArray: boolean; ownsObject: boolean; parentReferenceProperty: string; ngModelProperty: string; constructor(props: PropDescBase[], events?: EventDescBase[], complexProps?: ComplexPropDescBase[], parentProperty?: string, isParentPropertyArray?: boolean, ownsObject?: boolean, parentReferenceProperty?: string, ngModelProperty?: string); props: PropDescBase[]; events: EventDescBase[]; complexProps: ComplexPropDescBase[]; add(props: PropDescBase[], events?: EventDescBase[], complexProps?: ComplexPropDescBase[], parentProperty?: string, isParentPropertyArray?: boolean, ownsObject?: boolean, parentReferenceProperty?: string, ngModelProperty?: string): MetaDataBase; addOptions(options: any): this; prepare(): void; } } } declare module wijmo.knockout { class MetaFactory extends wijmo.meta.ControlMetaFactory { static CreateProp(propertyName: string, propertyType: wijmo.meta.PropertyType, changeEvent?: string, enumType?: any, isNativeControlProperty?: boolean, priority?: number): PropDesc; static CreateEvent(eventName: string, isPropChanged?: boolean): EventDesc; static CreateComplexProp(propertyName: string, isArray: boolean, ownsObject?: boolean): ComplexPropDesc; static findProp(propName: string, props: PropDesc[]): PropDesc; static findEvent(eventName: string, events: EventDesc[]): EventDesc; static findComplexProp(propName: string, props: ComplexPropDesc[]): ComplexPropDesc; } interface IUpdateControlHandler { (link: any, propDesc: PropDesc, control: any, unconvertedValue: any, convertedValue: any): boolean; } class PropDesc extends wijmo.meta.PropDescBase { updateControl: IUpdateControlHandler; } class EventDesc extends wijmo.meta.EventDescBase { } class ComplexPropDesc extends wijmo.meta.ComplexPropDescBase { } } /** * Contains KnockoutJS bindings for the Wijmo controls. * * The bindings allow you to add Wijmo controls to * KnockoutJS * applications using simple markup in HTML pages. * * To add a Wijmo control to a certain place in a page's markup, add the <div> * element and define a binding for the control in the data-bind attribute. * The binding name corresponds to the control name with a wj prefix. For example, the @see:wjInputNumber * binding represents the Wijmo @see:InputNumber control. The binding value is an object literal containing * properties corresponding to the control's read-write property and event names, with their values defining * the corresponding control property values and event handlers. * * The following markup creates a Wijmo InputNumber control with the value property bound to the * view model's theValue property, the step property set to 1 and the inputType property set to 'text': * *
<div data-bind="wjInputNumber: { value: theValue, step: 1, inputType: 'text' }"></div>* *
<wj-input-number value="theValue" step="1" input-type="'text'"></wj-input-number>* * Note that attribute values should be defined using exactly the same JavaScript expressions syntax as you use in * data-bind definitions. The Wijmo for Knockout preprocessor converts such elements to the conventional data-bind form, * see the Custom elements preprocessor topic for more details. * *
<!-- HTML --> * <div data-bind="wjInputNumber: { value: theValue, step: 1, valueChanged: valueChangedEH }"></div> * * //View Model * this.valueChangedEH = function (data, sender, args) { * alert('The new value is: ' + sender.value); * }* * The same control defined using the custom element syntax: * *
<wj-input-number value="theValue" step="1" value-changed="valueChangedEH"></wj-input-number>* *
<!-- HTML --> * <div data-bind="wjInputNumber: { value: theValue }"></div> * * //View Model * this.theValue = ko.observable();* *
<div data-bind="wjFlexChart: { itemsSource: data, bindingX: 'country' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: chartProps.titleX }"></div> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisY', title: chartProps.titleY }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Downloads', binding: 'downloads' }"></div> * </div>* * The same control defined using the custom element syntax: * *
<wj-flex-chart items-source="data" binding-x="'country'"> * <wj-flex-chart-axis wj-property="'axisX'" title="chartProps.titleX"></wj-flex-chart-axis> * <wj-flex-chart-axis wj-property="'axisY'" title="chartProps.titleY"></wj-flex-chart-axis> * <wj-flex-chart-series name="'Sales'" binding"'sales'"></wj-flex-chart-series> * <wj-flex-chart-series name="'Downloads'" binding"'downloads'"></wj-flex-chart-series> * </wj-flex-chart>* *
<!-- HTML --> * <div data-bind="'wjFlexGrid': { itemsSource: data, control: flex }"></div> * <button data-bind="click: moveToNext">Next</button> * * //View Model * this.flex = ko.observable(); * this.moveToNext = function () { * this.flex().collectionView.moveCurrentToNext(); * }* *
<!-- HTML --> * <div data-bind="'wjFlexGrid': { itemsSource: dataArray, initialized: flexInitialized }"> * <div data-bind="wjFlexGridColumn: { binding: 'sales', format: 'n2' }"></div> * <div data-bind="wjFlexGridColumn: { binding: 'downloads', format: 'n2' }"></div> * </div> * * //View Model * this.flexInitialized = function (data, sender, args) { * var columns = sender.columns; * for (var i = 0; i < columns.length; i++) { * if (columns[i].dataType = wijmo.DataType.Number) { * columns[i].format = 'n0’; * } * } * }* *
<script src="scripts/wijmo.js"></script> * <script src="scripts/wijmo.input.js"></script> * <script> * wijmo.disableKnockoutTags = true; * </script> * <script src="scripts/wijmo.knockout.js"></script>* * Note that in this case you can use only the conventional data-bind syntax for adding Wijmo controls to the page * markup; the Wijmo custom elements are not recognized. */ declare module wijmo.knockout { class WjBinding implements KnockoutBindingHandler { static _wjContextProp: string; static _parPropAttr: string; static _controlPropAttr: string; static _initPropAttr: string; static _initEventAttr: string; _metaData: wijmo.meta.MetaDataBase; init: any; update: any; ensureMetaData(): void; _initialize(): void; _getControlConstructor(): any; _getMetaDataId(): any; _createControl(element: any): any; _createWijmoContext(): WjContext; _isChild(): boolean; _isParentInitializer(): boolean; _isParentReferencer(): boolean; private _initImpl(element, valueAccessor, allBindings, viewModel, bindingContext); private _updateImpl; } class WjContext { element: any; valueAccessor: any; allBindings: any; viewModel: any; bindingContext: any; control: any; wjBinding: WjBinding; parentWjContext: WjContext; private _parentPropDesc; private _isInitialized; private static _debugId; constructor(wjBinding: WjBinding); init(element: any, valueAccessor: () => any, allBindings: KnockoutAllBindingsAccessor, viewModel: any, bindingContext: KnockoutBindingContext): any; update(element: any, valueAccessor: () => any, allBindings: KnockoutAllBindingsAccessor, viewModel: any, bindingContext: KnockoutBindingContext): void; _createControl(): any; _initControl(): void; _childrenInitialized(): void; private _addEventHandler(eventDesc); private static _isUpdatingSource; private static _pendingSourceUpdates; _updateSource(): void; private _isUpdatingControl; private _isSourceDirty; private _oldSourceValues; private _updateControl(valueAccessor?); private _castValueToType(value, prop); _safeUpdateSrcAttr(attrName: string, value: any): void; _safeNotifySrcAttr(attrName: string): void; private _isChild(); private _isParentInitializer(); private _isParentReferencer(); private _getParentProp(); private _getParentReferenceProperty(); private _useParentObj(); private _isParentArray(); private _parentInCtor(); } } declare module wijmo.knockout { /** * KnockoutJS binding for the @see:Tooltip class. * * Use the @see:wjTooltip binding to add tooltips to elements on the page. * The @see:wjTooltip supports HTML content, smart positioning, and touch. * * The @see:wjTooltip binding is specified on an * element that the tooltip applies to. The value is the tooltip * text or the id of an element that contains the text. For example: * *
<p data-bind="wjTooltip: '#fineprint'" > * Regular paragraph content...</p> * ... * <div id="fineprint" style="display:none" > * <h3>Important Note</h3> * <p> * Data for the current quarter is estimated by pro-rating etc...</p> * </div>*/ class wjTooltip extends WjBinding { _getControlConstructor(): any; _createControl(element: any): any; _createWijmoContext(): WjContext; } class WjTooltipContext extends WjContext { update(element: any, valueAccessor: () => any, allBindings: KnockoutAllBindingsAccessor, viewModel: any, bindingContext: KnockoutBindingContext): void; private _updateTooltip(); } } declare module wijmo.knockout { class WjDropDownBinding extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:ComboBox control. * * Use the @see:wjComboBox binding to add @see:ComboBox controls to your * KnockoutJS applications. For example: * *
<p>Here is a ComboBox control:</p> * <div data-bind="wjComboBox: { * itemsSource: countries, * text: theCountry, * isEditable: false, * placeholder: 'country' }"> * </div>* * The wjComboBox binding supports all read-write properties and events of * the @see:ComboBox control. The following properties provide two-way binding mode: *
<p>Here is an AutoComplete control:</p> * <div data-bind="wjAutoComplete: { * itemsSource: countries, * text: theCountry, * isEditable: false, * placeholder: 'country' }"> * </div>* * The wjAutoComplete binding supports all read-write properties and events of * the @see:AutoComplete control. The following properties provide two-way binding mode: *
<p>Here is a Calendar control:</p> * <div * data-bind="wjCalendar: { value: theDate }"> * </div>* * The wjCalendar binding supports all read-write properties and events of * the @see:Calendar control. The following properties provide two-way binding mode: *
<p>Here is a ColorPicker control:</p> * <div * data-bind="wjColorPicker: { value: theColor }"> * </div>* * The wjColorPicker binding supports all read-write properties and events of * the @see:ColorPicker control. The following properties provide two-way binding mode: *
<p>Here is a ListBox control:</p> * <div data-bind="wjListBox: { * itemsSource: countries, * selectedItem: theCountry }"> * </div>* * The wjListBox binding supports all read-write properties and events of * the @see:ListBox control. The following properties provide two-way binding mode: *
<p>Here is a Menu control used as a value picker:</p> * <div data-bind="wjMenu: { value: tax, header: 'Tax' }"> * <span data-bind="wjMenuItem: { value: 0 }">Exempt</span> * <span data-bind="wjMenuSeparator: {}"></span> * <span data-bind="wjMenuItem: { value: .05 }">5%</span> * <span data-bind="wjMenuItem: { value: .1 }">10%</span> * <span data-bind="wjMenuItem: { value: .15 }">15%</span> * </div>* * The wjMenu binding may contain the following child bindings: @see:wjMenuItem, @see:wjMenuSeparator. * * The wjMenu binding supports all read-write properties and events of * the @see:Menu control. The following properties provide two-way binding mode: *
<p>Here is a Menu control with four menu items:</p> * <div data-bind="wjMenu: { value: tax, header: 'Tax' }"> * <span data-bind="wjMenuItem: { value: 0 }">Exempt</span> * <span data-bind="wjMenuItem: { value: .05 }">5%</span> * <span data-bind="wjMenuItem: { value: .1 }">10%</span> * <span data-bind="wjMenuItem: { value: .15 }">15%</span> * </div>* * The wjMenuItem binding supports the following attributes: * *
<p>Here is a Menu control with four menu items and one separator:</p> * <div data-bind="wjMenu: { value: tax, header: 'Tax' }"> * <span data-bind="wjMenuItem: { value: 0 }">Exempt</span> * <span data-bind="wjMenuSeparator: {}"></span> * <span data-bind="wjMenuItem: { value: .05 }">5%</span> * <span data-bind="wjMenuItem: { value: .1 }">10%</span> * <span data-bind="wjMenuItem: { value: .15 }">15%</span> * </div>*/ class wjMenuSeparator extends WjBinding { _getMetaDataId(): any; _initialize(): void; _createControl(element: any): any; } /** * KnockoutJS binding for context menus. * * Use the @see:wjContextMenu binding to add context menus to elements * on the page. The @see:wjContextMenu binding is based on the @see:wjMenu; * it displays a popup menu when the user performs a context menu * request on an element (usually a right-click). * * The wjContextMenu binding is specified as a parameter added to the * element that the context menu applies to. The parameter value is a * CSS selector for the element that contains the menu. For example: * *
<!-- paragraph with a context menu --> *<p data-bind="wjContextMenu: { id: '#idMenu'}" > * This paragraph has a context menu.</p> * *<!-- define the context menu (hidden and with an id) --> * <div id="contextmenu" data-bind="wjMenu: { header: 'File', itemClicked: menuItemClicked}"> * <span data-bind="wjMenuItem: {}">New</span> * <span data-bind="wjMenuItem: {}">open an existing file or folder</span> * <span data-bind="wjMenuItem: {}">save the current file</span> * <span data-bind="wjMenuSeparator: {}"></span> * <span data-bind="wjMenuItem: {}">exit the application</span> * </div>*/ class wjContextMenu extends WjBinding { _getMetaDataId(): any; _createControl(element: any): any; _createWijmoContext(): WjContext; } class WjContextMenuContext extends WjContext { _initControl(): void; } /** * KnockoutJS binding for the @see:InputDate control. * * Use the @see:wjInputDate binding to add @see:InputDate controls to your * KnockoutJS applications. For example: * *
<p>Here is an InputDate control:</p> * <div data-bind="wjInputDate: { * value: theDate, * format: 'M/d/yyyy' }"> * </div>* * The wjInputDate binding supports all read-write properties and events of * the @see:InputDate control. The following properties provide two-way binding mode: *
<p>Here is an InputNumber control:</p> * <div data-bind="wjInputNumber: { * value: theNumber, * min: 0, * max: 10, * format: 'n0', * placeholder: 'number between zero and ten' }"> * </div>* * The wjInputNumber binding supports all read-write properties and events of * the @see:InputNumber control. The following properties provide two-way binding mode: *
<p>Here is an InputMask control:</p> * <div data-bind="wjInputMask: { * mask: '99/99/99', * promptChar: '*' }"> * </div>* * The wjInputMask binding supports all read-write properties and events of * the @see:InputMask control. The value property provides two-way binding mode. */ class wjInputMask extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:InputTime control. * * Use the @see:wjInputTime binding to add @see:InputTime controls to your * KnockoutJS applications. For example: * *
<p>Here is an InputTime control:</p> * <div data-bind="wjInputTime: { * min: new Date(2014, 8, 1, 9, 0), * max: new Date(2014, 8, 1, 17, 0), * step: 15, * format: 'h:mm tt', * value: theDate }"> * </div>* * The wjInputTime binding supports all read-write properties and events of * the @see:InputTime control. The following properties provide two-way binding mode: *
<p>Here is a InputColor control:</p> * <div * data-bind="wjInputColor: { value: theColor }"> * </div>* * The wjInputColor binding supports all read-write properties and events of * the @see:InputColor control. The following properties provide two-way binding mode: *
Here is a CollectionViewPager:</p> * <div * data-bind="wjCollectionViewPager: { cv: myCollectionView }"> * </div>* * The @see:wjCollectionViewPager directive has a single attribute: * *
Here is a CollectionViewNavigator:</p> * <div * data-bind="wjCollectionViewNavigator: { cv: myCollectionView }"> * </div>* * The @see:wjCollectionViewNavigator directive has a single attribute: * *
<p>Here is a MultiSelect control:</p> * <div data-bind="MultiSelect: { * itemsSource: countries, * isEditable: false, * headerFormat: '{count} countries selected' }"> * </div>* * The wjMultiSelect binding supports all read-write properties and events of * the @see:MultiSelect control. The following properties provide two-way binding mode: *
<p>Here is a MultiAutoComplete control:</p> * <div data-bind="MultiAutoComplete: { * itemsSource: countries, * maxSelectedItems: 4,}"> * </div>* * The wjMultiAutoComplete binding supports all read-write properties and events of * the @see:MultiAutoComplete control. */ class wjMultiAutoComplete extends wjAutoComplete { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:Popup control. * * Use the @see:wjPopup binding to add @see:Popup controls to your * KnockoutJS applications. For example: * *
<p>Here is a Popup control triggered by a button:</p> * <button id="btn2" type="button"> * Click to show Popup * </button> * <div class="popover" data-bind="wjPopup: { * control: popup, * owner: '#btn2', * showTrigger: 'Click', * hideTrigger: 'Click'}" * > * <h3> * Salutation * </h3> * <div class="popover-content"> * Hello {{firstName}} {{lastName}} * </div> * </div>*/ class wjPopup extends WjBinding { _getControlConstructor(): any; _createWijmoContext(): WjContext; _initialize(): void; } class WjPopupContext extends WjContext { _initControl(): void; _updateModal(convertedValue: any): void; } } declare module wijmo.knockout { /** * KnockoutJS binding for the @see:FlexGrid control. * * Use the @see:wjFlexGrid binding to add @see:FlexGrid controls to your * KnockoutJS applications. For example: * *
<p>Here is a FlexGrid control:</p> * <div data-bind="wjFlexGrid: { itemsSource: data }"> * <div data-bind="wjFlexGridColumn: { * header: 'Country', * binding: 'country', * width: '*' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Date', * binding: 'date' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Revenue', * binding: 'amount', * format: 'n0' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Active', * binding: 'active' }"> * </div> * </div>* * The wjFlexGrid binding may contain @see:wjFlexGridColumn child bindings. * * The wjFlexGrid binding supports all read-write properties and events of * the @see:FlexGrid control, except for the scrollPosition, * selection and columnLayout properties. */ class wjFlexGrid extends WjBinding { static _columnTemplateProp: string; static _cellClonedTemplateProp: string; static _cellVMProp: string; static _templColIdx: string; static _columnStyleBinding: string; static _columnStyleProp: string; _getControlConstructor(): any; _createWijmoContext(): WjContext; _initialize(): void; private _formatterPropHandler(link, propDesc, control, unconvertedValue, convertedValue); } class WjFlexGridContext extends WjContext { _wrapperFormatter: any; _userFormatter: Function; _initControl(): void; private _itemFormatter(panel, r, c, cell); } /** * KnockoutJS binding for the @see:FlexGrid @see:Column object. * * The @see:wjFlexGridColumn binding must be contained in a @see:wjFlexGrid binding. For example: * *
<p>Here is a FlexGrid control:</p> * <div data-bind="wjFlexGrid: { itemsSource: data }"> * <div data-bind="wjFlexGridColumn: { * header: 'Country', * binding: 'country', * width: '*' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Date', * binding: 'date' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Revenue', * binding: 'amount', * format: 'n0' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Active', * binding: 'active' }"> * </div> * </div>* * The wjFlexGridColumn binding supports all read-write properties and events of * the @see:Column class. The isSelected property provides two-way binding mode. * * In addition to regular attributes that match properties in the Column class, * an element with the @see:wjFlexGridColumn binding may contain a @see:wjStyle binding that * provides conditional formatting and an HTML fragment that is used as a cell template. Grid * rows automatically stretch vertically to fit custom cell contents. * * Both the wjStyle binding and the HTML fragment can use the $item observable variable in * KnockoutJS bindings to refer to the item that is bound to the current row. Also available are the * $row and $col observable variables containing cell row and column indexes. For example: * *
<div data-bind="wjFlexGridColumn: { * header: 'Symbol', * binding: 'symbol', * readOnly: true, * width: '*' }"> * <a data-bind="attr: { * href: 'https://finance.yahoo.com/q?s=' + $item().symbol() }, * text: $item().symbol"> * </a> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Change', * binding: 'changePercent', * format: 'p2', * width: '*' * }, * wjStyle: { * color: getAmountColor($item().change) }"> * </div>* * These bindings create two columns. * The first has a template that produces a hyperlink based on the bound item's "symbol" property. * The second has a conditional style that renders values with a color determined by a function * implemented in the controller. */ class wjFlexGridColumn extends WjBinding { _getControlConstructor(): any; _createControl(element: any): any; _createWijmoContext(): WjContext; } class WjFlexGridColumnContext extends WjContext { _initControl(): void; } /** * KnockoutJS binding for conditional formatting of @see:FlexGrid @see:Column cells. * * Use the @see:wjStyle binding together with the @see:wjFlexGridColumn binding to provide * conditional formatting to column cells. * For example: * *
<div data-bind="wjFlexGridColumn: { * header: 'Change', * binding: 'changePercent', * format: 'p2', * width: '*' * }, * wjStyle: { color: getAmountColor($item().change) }"></div>* * * The wjStyle uses the same syntax as the native KnockoutJS * style binding. * In addition to the view model properties, the following observable variables are available in binding * expressions: * *
<p>Here is a FlexGrid control with column filters:</p> * <div data-bind="wjFlexGrid: { itemsSource: data }"> * <div data-bind="wjFlexGridFilter: { filterColumns: ['country', 'amount'] }"></div> * * <div data-bind="wjFlexGridColumn: { * header: 'Country', * binding: 'country', * width: '*' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Date', * binding: 'date' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Revenue', * binding: 'amount', * format: 'n0' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Active', * binding: 'active' }"> * </div> * </div>* * The wjFlexGridFilter binding supports all read-write properties and events of * the @see:FlexGridFilter class. * */ class wjFlexGridFilter extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:FlexGrid @see:GroupPanel control. * * The wjGroupPanel binding should be connected to the FlexGrid control using the grid property. * For example: * *
<p>Here is a FlexGrid control with GroupPanel:</p> * * <div data-bind="wjGroupPanel: { grid: flex(), placeholder: 'Drag columns here to create groups.' }"></div> * * <div data-bind="wjFlexGrid: { control: flex, itemsSource: data }"> * <div data-bind="wjFlexGridColumn: { * header: 'Country', * binding: 'country', * width: '*' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Date', * binding: 'date' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Revenue', * binding: 'amount', * format: 'n0' }"> * </div> * <div data-bind="wjFlexGridColumn: { * header: 'Active', * binding: 'active' }"> * </div> * </div>* * The wjGroupPanel binding supports all read-write properties and events of * the @see:GroupPanel class. * */ class wjGroupPanel extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:FlexSheet control. * * Use the @see:wjFlexSheet binding to add @see:FlexSheet controls to your * KnockoutJS applications. * * The wjFlexSheet binding may contain @see:wjSheet child bindings. * * The wjFlexSheet binding supports all read-write properties and events of * the @see:FlexSheet control. */ class wjFlexSheet extends wjFlexGrid { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:FlexSheet @see:Sheet object. * * The @see:wjSheet binding must be contained in a @see:wjFlexSheet binding. * * The wjSheet binding supports all read-write properties and events of * the @see:Sheet class. * */ class wjSheet extends WjBinding { _getControlConstructor(): any; _createWijmoContext(): WjContext; } class WjSheetContext extends WjContext { _initControl(): grid.sheet.Sheet; } /** * KnockoutJS binding for the @see:MultiRow object. * Use the @see:wjMultiRow binding to add @see:MultiRow controls to your * KnockoutJS applications. For example: * <div data-bind="wjMultiRow: * { * itemsSource: orders, * layoutDefinition: ldThreeLines * }"> * </div> * * The wjMultiRow binding supports all read-write properties and events of * the @see:MultiRow class. * */ class wjMultiRow extends wjFlexGrid { _getControlConstructor(): any; } } declare module wijmo.knockout { class WjFlexChartBaseBinding extends WjBinding { _getControlConstructor(): any; _initialize(): void; } /** * KnockoutJS binding for the @see:FlexChart control. * * Use the @see:wjFlexChart binding to add @see:FlexChart controls to your * KnockoutJS applications. For example: * *
<p>Here is a FlexChart control:</p> * <div data-bind="wjFlexChart: { itemsSource: data }"> * <div data-bind="wjFlexChartLegend : { * position: 'Top' }"> * </div> * <div data-bind="wjFlexChartAxis: { * wjProperty: 'axisX', * title: chartProps.titleX }"> * </div> * <div data-bind="wjFlexChartAxis: { * wjProperty: 'axisY', * majorUnit: 5000 }"> * </div> * <div data-bind="wjFlexChartSeries: { * name: 'Sales', * binding: 'sales' }"> * </div> * <div data-bind="wjFlexChartSeries: { * name: 'Expenses', * binding: 'expenses' }"> * </div> * <div data-bind="wjFlexChartSeries: { * name: 'Downloads', * binding: 'downloads', * chartType: 'LineSymbols' }"> * </div> * </div>* * The wjFlexChart binding may contain the following child bindings: * @see:wjFlexChartAxis, @see:wjFlexChartSeries, @see:wjFlexChartLegend. * * The wjFlexChart binding supports all read-write properties and events of * the @see:FlexChart control, and the additional tooltipContent property * that assigns a value to the FlexChart.tooltip.content property. * The selection property provides two-way binding mode. */ class wjFlexChart extends WjFlexChartBaseBinding { _getControlConstructor(): any; _initialize(): void; } /** * KnockoutJS binding for the @see:FlexPie control. * * Use the @see:wjFlexPie binding to add @see:FlexPie controls to your * KnockoutJS applications. For example: * *
<p>Here is a FlexPie control:</p> * <div data-bind="wjFlexPie: { * itemsSource: data, * binding: 'value', * bindingName: 'name', * header: 'Fruit By Value' }"> * <div data-bind="wjFlexChartLegend : { position: 'Top' }"></div> * </div>* * The wjFlexPie binding may contain the @see:wjFlexChartLegend child binding. * * The wjFlexPie binding supports all read-write properties and events of * the @see:FlexPie control. */ class wjFlexPie extends WjFlexChartBaseBinding { _getControlConstructor(): any; _initialize(): void; } /** * KnockoutJS binding for the @see:FlexChart @see:Axis object. * * The @see:wjFlexChartAxis binding must be contained in a @see:wjFlexChart binding. Use the wjProperty * attribute to specify the property (axisX or axisY) to initialize with this binding. * * The wjFlexChartAxis binding supports all read-write properties and events of * the @see:Axis class. */ class wjFlexChartAxis extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the Charts' @see:Legend object. * * The @see:wjFlexChartLegend binding must be contained in one the following bindings: * @see:wjFlexChart, @see:wjFlexPie. * * The wjFlexChartLegend binding supports all read-write properties and events of * the @see:Legend class. */ class wjFlexChartLegend extends WjBinding { _getControlConstructor(): any; } class WjSeriesBase extends WjBinding { _getControlConstructor(): any; _createControl(element: any): any; } /** * KnockoutJS binding for the @see:FlexChart @see:Series object. * * The @see:wjFlexChartSeries binding must be contained in a @see:wjFlexChart binding. * * The wjFlexChartSeries binding supports all read-write properties and events of * the @see:Series class. The visibility property provides two-way binding mode. */ class wjFlexChartSeries extends WjSeriesBase { _getControlConstructor(): any; _createWijmoContext(): WjContext; } class WjFlexChartSeriesContext extends WjContext { _initControl(): void; } /** * KnockoutJS binding for the @see:FinancialChart control. * * Use the @see:wjFinancialChart binding to add @see:FinancialChart controls to your * KnockoutJS applications. For example: * *
<p>Here is a FinancialChart control:</p> * <div data-bind="wjFinancialChart: { itemsSource: data, chartType: 'Candlestick' }"> * <div data-bind="wjFlexChartLegend : { * position: 'Top' }"> * </div> * <div data-bind="wjFinancialChartSeries: { * name: 'close', * binding: 'high,low,open,close' }"> * </div> * </div> * </div>* * The wjFinancialChart binding may contain the following child bindings: * @see:wjFlexChartAxis, @see:wjFinancialChartSeries, @see:wjFlexChartLegend. * * The wjFinancialChart binding supports all read-write properties and events of * the @see:FinancialChart control, and the additional tooltipContent property * that assigns a value to the FinancialChart.tooltip.content property. * The selection property provides two-way binding mode. */ class wjFinancialChart extends WjFlexChartBaseBinding { _getControlConstructor(): any; _initialize(): void; } /** * KnockoutJS binding for the @see:FinancialChart @see:FinancialSeries object. * * The @see:WjFinancialChartSeries binding must be contained in a @see:wjFinancialChart binding. * * The WjFinancialChartSeries binding supports all read-write properties and events of * the @see:FinancialSeries class. The visibility property provides two-way binding mode. */ class wjFinancialChartSeries extends WjBinding { _getControlConstructor(): any; _createWijmoContext(): WjContext; } class WjFinancialChartSeriesContext extends WjContext { _initControl(): void; } /** * KnockoutJS binding for the @see:LineMarker control. * * Use the @see:wjFlexChartLineMarker binding to add @see:LineMarker controls to your * KnockoutJS applications. For example: * *
<p>Here is a LineMarker:</p> * <div data-bind="wjFlexChart: { itemsSource: data, bindingX: 'country' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: 'country' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Expenses', binding: 'expenses' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Downloads', binding: 'downloads' }"></div> * <div data-bind="wjFlexChartLineMarker: { interaction: 'Move', lines: 'Both' }"></div> * </div>* * * The wjFlexChartLineMarker binding supports all read-write properties and events of * the @see:LineMarker class. */ class wjFlexChartLineMarker extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:RangeSelector control. * * Use the @see:wjFlexChartRangeSelector binding to add @see:RangeSelector controls to your * KnockoutJS applications. For example: * *
<p>Here is a RangeSelector control:</p> * <div data-bind="wjFlexChart: { itemsSource: data, bindingX: 'country' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: 'country' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Expenses', binding: 'expenses' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Downloads', binding: 'downloads' }"></div> * <div data-bind="wjFlexChartRangeSelector: { seamless: 'true',rangeChanged: rangeChanged }"></div> * </div>* * The wjFlexChartRangeSelector binding supports all read-write properties and events of * the @see:RangeSelector class. */ class wjFlexChartRangeSelector extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:ChartGestures object. * * Use the @see:wjFlexChartGestures binding to add @see:ChartGestures controls to your * KnockoutJS applications. For example: * *
<p>Here is a ChartGestures:</p> * <div data-bind="wjFlexChart: { itemsSource: data, bindingX: 'country' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: 'country' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartGestures: { scaleX:0.5, posX:0.1 } "></div> * </div>* * The wjFlexChartGestures binding supports all read-write properties and events of * the @see:ChartGestures class. */ class wjFlexChartGestures extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:PlotArea object. * * Use the @see:wjFlexChartPlotArea binding to add @see:PlotArea object to your * KnockoutJS applications. For example: * *
<p>Here is a PlotArea:</p> * <div data-bind="wjFlexChart: { itemsSource: data, bindingX: 'country' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: 'country' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartPlotArea: { row:0, name:'plot1', style:{ fill: 'rgba(136,189,230,0.2)'} } "></div> * </div>* * The wjFlexChartPlotArea binding supports all read-write properties and events of * the @see:PlotArea class. */ class wjFlexChartPlotArea extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:DataPoint object. * The wjFlexChartDataPoint must be contained in a * @see:wjFlexChartAnnotation. The property of the parent object * where wjFlexChartDataPoint should assign a value is specified in the * wjProperty attribute. * * Use the @see:wjFlexChartDataPoint binding to add @see:DataPoint object to your * KnockoutJS applications. For example: * *
<p>Here is a DataPoint:</p> * <div data-bind="wjFlexChartDataPoint: { wjProperty: 'point', x: 0.9, y:0.4}" ></div> ** * The wjFlexChartDataPoint binding supports all read-write properties and events of * the @see:DataPoint class. */ class wjFlexChartDataPoint extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:AnnotationLayer object. * * Use the @see:wjFlexChartAnnotationLayer binding to add @see:AnnotationLayer object to your * KnockoutJS applications. For example: * *
<p>Here is a AnnotationLayer:</p> *<div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date', chartType:'Candlestick' }"> * <div data-bind="wjFinancialChartSeries: { bindingX: 'date', binding: 'high,low,open,close' }"></div> * <div data-bind="wjFlexChartAnnotationLayer: {}"> * <div data-bind="wjFlexChartAnnotation: { type: 'Rectangle', content: 'E',height:20, width:20,attachment:'DataIndex',pointIndex: 10}"></div> * <div data-bind="wjFlexChartAnnotation: { type: 'Ellipse', content: 'E',height:20, width:20,attachment:'DataIndex',pointIndex: 30}"></div> * </div> </div>* * The wjFlexChartAnnotationLayer binding supports all read-write properties and events of * the @see:AnnotationLayer class. */ class wjFlexChartAnnotationLayer extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for annotations. * * The wjFlexChartAnnotation must be contained in a * @see:wjFlexChartAnnotationLayer binding.For example: *
<p>Here is a AnnotationLayer:</p> *<div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date', chartType:'Candlestick' }"> * <div data-bind="wjFinancialChartSeries: { bindingX: 'date', binding: 'high,low,open,close' }"></div> * <div data-bind="wjFlexChartAnnotationLayer: {}"> * <div data-bind="wjFlexChartAnnotation: { type: 'Rectangle', content: 'E',height:20, width:20,attachment:'DataIndex',pointIndex: 10}"></div> * <div data-bind="wjFlexChartAnnotation: { type: 'Ellipse', content: 'E',height:20, width:20,attachment:'DataIndex',pointIndex: 30}"></div> * </div> </div>* * The wjFlexChartAnnotation is used to represent all types of * possible annotation shapes like Circle, Rectangle, Polygon * and so on. The type of annotation shape is specified * in the type attribute. */ class wjFlexChartAnnotation extends WjBinding { _context: any; _createControl(element: any): any; _getMetaDataId(): any; _createWijmoContext(): WjContext; } class wjFlexChartAnnotationContext extends WjContext { _createAnnotation(): any; } /** * KnockoutJS binding for the @see:ChartAnimation object. * * Use the @see:wjFlexChartAnimation binding to add @see:ChartAnimation object to your * KnockoutJS applications. For example: * *
<p>Here is a ChartAnimation:</p> * <div data-bind="wjFlexChart: { itemsSource: data, bindingX: 'country',chartType:'Column' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: 'country' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartAnimation: { animationMode: 'Series',easing:'Swing',duration:2000 } "></div> * </div>* * The wjFlexChartAnimation binding supports all read-write properties and events of * the @see:ChartAnimation class. */ class wjFlexChartAnimation extends WjBinding { _getControlConstructor(): any; } class WjTrendLineBase extends WjSeriesBase { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:TrendLine object. * * Use the @see:wjFlexChartTrendLine binding to add @see:TrendLine object to your * KnockoutJS applications. For example: * *
<p>Here is a TrendLine:</p> * <div data-bind="wjFlexChart: { itemsSource: data, bindingX: 'country',chartType:'Column' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: 'country' }"></div> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartAnimation: { animationMode: 'Series',easing:'Swing',duration:2000 } "></div> * </div>* * The wjFlexChartTrendLine binding supports all read-write properties and events of * the @see:TrendLine class. */ class wjFlexChartTrendLine extends WjTrendLineBase { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:MovingAverage object. * * Use the @see:wjFlexChartMovingAverage binding to add @see:MovingAverage object to your * KnockoutJS applications. For example: * *
<p>Here is a MovingAverage:</p> * <div data-bind="wjFlexChart: { itemsSource: trendItemsSource, bindingX: 'x' }"> * <div data-bind="wjFlexChartAxis: { wjProperty: 'axisX', title: 'country' }"></div> * <div data-bind="wjFlexChartSeries: { chartType: 'Scatter', name: 'Base Data', binding: 'y' }"></div> * <div data-bind="wjFlexChartMovingAverage: { binding: 'y', bindingX: 'x', period:2 } "></div> * </div>* * The wjFlexChartMovingAverage binding supports all read-write properties and events of * the @see:MovingAverage class. */ class wjFlexChartMovingAverage extends WjTrendLineBase { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:YFunctionSeries object. * * Use the @see:wjFlexChartYFunctionSeries binding to add @see:YFunctionSeries object to your * KnockoutJS applications. For example: * *
<p>Here is a YFunctionSeries:</p> * <div data-bind="wjFlexChart: { itemsSource: trendItemsSource, bindingX: 'x' }"> * <div data-bind="wjFlexChartYFunctionSeries: { min: 10, max: -10, sampleCount:100,func:func }"></div> * </div>* * The wjFlexChartYFunctionSeries binding supports all read-write properties and events of * the @see:YFunctionSeries class. */ class wjFlexChartYFunctionSeries extends WjTrendLineBase { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:ParametricFunctionSeries object. * * Use the @see:wjFlexChartParametricFunctionSeries binding to add @see:ParametricFunctionSeries object to your * KnockoutJS applications. For example: * *
<p>Here is a ParametricFunctionSeries:</p> * <div data-bind="wjFlexChart: { itemsSource: trendItemsSource, bindingX: 'x' }"> * <div data-bind="wjFlexChartSeries: { name: 'Sales', binding: 'sales' }"></div> * <div data-bind="wjFlexChartParametricFunctionSeries: { sampleCount:1000, max: max,xFunc:xFunc,yFunc:yFunc }"></div> * </div>* * The wjFlexChartParametricFunctionSeries binding supports all read-write properties and events of * the @see:ParametricFunctionSeries class. */ class wjFlexChartParametricFunctionSeries extends WjTrendLineBase { _getControlConstructor(): any; _initialize(): void; } /** * KnockoutJS binding for the @see:Waterfall object. * * Use the @see:wjFlexChartWaterfall binding to add @see:Waterfall object to your * KnockoutJS applications. For example: * *
<p>Here is a Waterfall:</p> * <div data-bind="wjFlexChart: { itemsSource: trendItemsSource, binding:'value',bindingX: 'name' }"> * <div data-bind="wjFlexChartWaterfall: { relativeData:true, connectorLines: true, start:1000,showIntermediateTotal: true, * intermediateTotalPositions: [3, 6, 9, 12], intermediateTotalLabels: ['Q1', 'Q2', 'Q3', 'Q4'],name:'Increase,Decrease,Total'}"></div> * </div>* * The wjFlexChartWaterfall binding supports all read-write properties and events of * the @see:Waterfall class. */ class wjFlexChartWaterfall extends WjSeriesBase { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:Fibonacci object. * * Use the @see:wjFlexChartFibonacci binding to add @see:Fibonacci object to your * KnockoutJS applications. For example: * *
<p>Here is a Fibonacci:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date', chartType:'Candlestick' }"> * <div data-bind="wjFinancialChartSeries: { bindingX: 'date', binding: 'high,low,open,close' }"></div> * <div data-bind="wjFlexChartFibonacci: { binding:'close', symbolSize:1, labelPosition: 'Left', uptrend: true}"></div> * </div>* * The wjFlexChartFibonacci binding supports all read-write properties and events of * the @see:Fibonacci class. */ class wjFlexChartFibonacci extends WjSeriesBase { _getControlConstructor(): any; _createControl(element: any): any; } /** * KnockoutJS binding for the @see:FibonacciArcs object. * * Use the @see:wjFlexChartFibonacciArcs binding to add @see:FibonacciArcs object to your * KnockoutJS applications. For example: * *
<p>Here is a FibonacciArcs:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date', chartType:'Candlestick' }"> * <div data-bind="wjFinancialChartSeries: { bindingX: 'date', binding: 'high,low,open,close' }"></div> * <div data-bind="wjFlexChartFibonacciArcs: { binding:'close', start:start, end: end, labelPosition: 'Top'}"></div> * </div>* * The wjFlexChartFibonacciArcs binding supports all read-write properties and events of * the @see:FibonacciArcs class. */ class wjFlexChartFibonacciArcs extends WjSeriesBase { _getControlConstructor(): any; _createControl(element: any): any; } /** * KnockoutJS binding for the @see:FibonacciFans object. * * Use the @see:wjFlexChartFibonacciFans binding to add @see:FibonacciFans object to your * KnockoutJS applications. For example: * *
<p>Here is a FibonacciFans:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date', chartType:'Candlestick' }"> * <div data-bind="wjFinancialChartSeries: { bindingX: 'date', binding: 'high,low,open,close' }"></div> * <div data-bind="wjFlexChartFibonacciFans: { binding:'close', start:start, end: end, labelPosition: 'Top'}"></div> * </div>* * The wjFlexChartFibonacciFans binding supports all read-write properties and events of * the @see:FibonacciFans class. */ class wjFlexChartFibonacciFans extends WjSeriesBase { _getControlConstructor(): any; _createControl(element: any): any; } /** * KnockoutJS binding for the @see:FibonacciTimeZones object. * * Use the @see:wjFlexChartFibonacciTimeZones binding to add @see:FibonacciTimeZones object to your * KnockoutJS applications. For example: * *
<p>Here is a FibonacciTimeZones:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date', chartType:'Candlestick' }"> * <div data-bind="wjFinancialChartSeries: { bindingX: 'date', binding: 'high,low,open,close' }"></div> * <div data-bind="wjFlexChartFibonacciTimeZones: { binding:'close', startX:zStart, endX: zEnd, labelPosition: 'Right'}"></div> * </div>* * The wjFlexChartFibonacciTimeZones binding supports all read-write properties and events of * the @see:FibonacciTimeZones class. */ class wjFlexChartFibonacciTimeZones extends WjSeriesBase { _getControlConstructor(): any; _createControl(element: any): any; } class WjBaseOverlayIndicator extends WjSeriesBase { _getControlConstructor(): any; } class WjBaseSingleOverlayIndicator extends WjBaseOverlayIndicator { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:ATR object. * * Use the @see:wjFlexChartAtr binding to add @see:ATR object to your * KnockoutJS applications. For example: * *
<p>Here is a ATR:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="wjFlexChartAtr: { binding: 'high,low,open,close',period:'14' }"></div> * </div>* * The wjFlexChartAtr binding supports all read-write properties and events of * the @see:ATR class. */ class wjFlexChartAtr extends WjBaseSingleOverlayIndicator { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:CCI object. * * Use the @see:wjFlexChartCci binding to add @see:CCI object to your * KnockoutJS applications. For example: * *
<p>Here is a CCI:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="wjFlexChartCci: { binding: 'high,low,open,close',period:20 }"></div> * </div>* * The wjFlexChartCci binding supports all read-write properties and events of * the @see:CCI class. */ class wjFlexChartCci extends WjBaseSingleOverlayIndicator { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:RSI object. * * Use the @see:wjFlexChartRsi binding to add @see:RSI object to your * KnockoutJS applications. For example: * *
<p>Here is a RSI:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date', chartType:'Candlestick' }"> * <div data-bind="wjFlexChartRsi: { binding: 'high,low,open,close',period:20 }"></div> * </div>* * The wjFlexChartRsi binding supports all read-write properties and events of * the @see:RSI class. */ class wjFlexChartRsi extends WjBaseSingleOverlayIndicator { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:WilliamsR object. * * Use the @see:wjFlexChartWilliamsR binding to add @see:WilliamsR object to your * KnockoutJS applications. For example: * *
<p>Here is a WilliamsR:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="wjFlexChartWilliamsR: { binding: 'high,low,open,close',period:20 }"></div> * </div>* * The wjFlexChartWilliamsR binding supports all read-write properties and events of * the @see:WilliamsR class. */ class wjFlexChartWilliamsR extends WjBaseSingleOverlayIndicator { _getControlConstructor(): any; } class WjFlexChartMacdBase extends WjBaseOverlayIndicator { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:Macd object. * * Use the @see:wjFlexChartMacd binding to add @see:Macd object to your * KnockoutJS applications. For example: * *
<p>Here is a Macd:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="wjFlexChartMacd: { binding: 'close',fastPeriod:12, slowPeriod: 26,smoothingPeriod: 9 }" ></div> * </div>* * The wjFlexChartMacd binding supports all read-write properties and events of * the @see:Macd class. */ class wjFlexChartMacd extends WjFlexChartMacdBase { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:MacdHistogram object. * * Use the @see:wjFlexChartMacdHistogram binding to add @see:MacdHistogram object to your * KnockoutJS applications. For example: * *
<p>Here is a MacdHistogram:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="WjFlexChartMacdHistogram: { binding: 'close',fastPeriod:12, slowPeriod: 26,smoothingPeriod: 9 }" ></div> * </div>* * The wjFlexChartMacdHistogram binding supports all read-write properties and events of * the @see:MacdHistogram class. */ class wjFlexChartMacdHistogram extends WjFlexChartMacdBase { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:Stochastic object. * * Use the @see:wjFlexChartStochastic binding to add @see:Stochastic object to your * KnockoutJS applications. For example: * *
<p>Here is a Stochastic:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="wjFlexChartStochastic: { binding: 'high,low,open,close',kPeriod:14,dPeriod:3,smoothingPeriod: 1 }" ></div> * </div>* * The wjFlexChartStochastic binding supports all read-write properties and events of * the @see:Stochastic class. */ class wjFlexChartStochastic extends WjBaseOverlayIndicator { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:BollingerBands object. * * Use the @see:wjFlexChartBollingerBands binding to add @see:BollingerBands object to your * KnockoutJS applications. For example: * *
<p>Here is a BollingerBands:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="wjFlexChartStochastic: { binding: 'high,low,open,close',kPeriod:14,dPeriod:3,smoothingPeriod: 1 }" ></div> * </div>* * The wjFlexChartBollingerBands binding supports all read-write properties and events of * the @see:BollingerBands class. */ class wjFlexChartBollingerBands extends WjBaseOverlayIndicator { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:Envelopes object. * * Use the @see:wjFlexChartEnvelopes binding to add @see:Envelopes object to your * KnockoutJS applications. For example: * *
<p>Here is a Envelopes:</p> * <div data-bind="wjFinancialChart: { itemsSource: fData, bindingX: 'date'}"> * <div data-bind="wjFlexChartEnvelopes: { binding:'close', type:'Simple', size: 0.03, period:20}" ></div> * </div>* * The wjFlexChartEnvelopes binding supports all read-write properties and events of * the @see:Envelopes class. */ class wjFlexChartEnvelopes extends WjBaseOverlayIndicator { _getControlConstructor(): any; } } declare module wijmo.knockout { class WjGaugeBinding extends WjBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:LinearGauge control. * * Use the @see:wjLinearGauge binding to add @see:LinearGauge controls to your * KnockoutJS applications. For example: * *
<p>Here is a LinearGauge control:</p> * <div data-bind="wjLinearGauge: { * value: props.value, * min: props.min, * max: props.max, * format: props.format, * showRanges: props.showRanges }" * <class="linear-gauge"> * <div data-bind="wjRange: { * wjProperty: 'pointer', * thickness: props.ranges.pointerThickness }"> * </div> * <div data-bind="wjRange: { * min: props.ranges.lower.min, * max: props.ranges.lower.max, * color: props.ranges.lower.color }"> * </div> * <div data-bind="wjRange: { * min: props.ranges.middle.min, * max: props.ranges.middle.max, * color: props.ranges.middle.color }"> * </div> * <div data-bind="wjRange: { * min: props.ranges.upper.min, * max: props.ranges.upper.max, * color: props.ranges.upper.color }"> * </div> * </div>* * The wjLinearGauge binding may contain the @see:wjRange child binding. * * The wjLinearGauge binding supports all read-write properties and events of * the @see:LinearGauge control. The value property provides two-way binding mode. */ class wjLinearGauge extends WjGaugeBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:BulletGraph control. * * Use the @see:wjBulletGraph binding to add @see:BulletGraph controls to your * KnockoutJS applications. For example: * *
<p>Here is a BulletGraph control:</p> * <div data-bind="wjBulletGraph: { * value: props.value, * min: props.min, * max: props.max, * format: props.format, * good: props.ranges.middle.max, * bad: props.ranges.middle.min, * target: props.ranges.target, * showRanges: props.showRanges }" * class="linear-gauge"> * <div data-bind="wjRange: { * wjProperty: 'pointer', * thickness: props.ranges.pointerThickness }"> * </div> * </div>* * The wjBulletGraph binding may contain the @see:wjRange child binding. * * The wjBulletGraph binding supports all read-write properties and events of * the @see:BulletGraph control. The value property provides two-way binding mode. */ class wjBulletGraph extends wjLinearGauge { _getControlConstructor(): any; } /** * KnockoutJS binding for the @see:RadialGauge control. * * Use the @see:wjRadialGauge binding to add @see:RadialGauge controls to your * KnockoutJS applications. For example: * *
<p>Here is a RadialGauge control:</p> * <div data-bind="wjRadialGauge: { * value: props.value, * min: props.min, * max: props.max, * format: props.format, * showRanges: props.showRanges }" * class="radial-gauge"> * <div data-bind="wjRange: { * wjProperty: 'pointer', * thickness: props.ranges.pointerThickness }"> * </div> * <div data-bind="wjRange: { * min: props.ranges.lower.min, * max: props.ranges.lower.max, * color: props.ranges.lower.color }"> * </div> * <div data-bind="wjRange: { * min: props.ranges.middle.min, * max: props.ranges.middle.max, * color: props.ranges.middle.color }"> * </div> * <div data-bind="wjRange: { * min: props.ranges.upper.min, * max: props.ranges.upper.max, * color: props.ranges.upper.color }"> * </div> * </div>* * The wjRadialGauge binding may contain the @see:wjRange child binding. * * The wjRadialGauge binding supports all read-write properties and events of * the @see:RadialGauge control. The value property provides two-way binding mode. */ class wjRadialGauge extends WjGaugeBinding { _getControlConstructor(): any; } /** * KnockoutJS binding for the Gauge's @see:Range object. * * The @see:wjRange binding must be contained in one of the following bindings: *