52
Name
Description
@
The shape of marker to use for the series. This value overrides the default marker set
t
on the chart. See Marker.
.
symbol-size
@
The size of the symbols used to render data points in this series for Scatter,
LineSymbols, and SplineSymbols charts, in pixels. This value overrides any set at the
chart level.
symbol-style
=
The style of the symbols used to render data points in this series for Scatter,
LineSymbols, and SplineSymbols charts. This value overrides any setting at the chart
level.
visibility
=
The SeriesVisibility value indicating whether and where to display the series.
ies.
period
@
The period for the Williams %R calculation.
WjFlexChartYFunctionSeries
AngularJS directive for the FlexChart and FinancialChart YFunctionSeries object.
object.
The wj-flex-chart-y-function-series directive must be contained in
contained in
a WjFlexChart or WjFinancialChart directive. It supports the following attributes:
butes:
binding
@
The name of the property that contains Y values for the series. This value overrides
any binding set for the chart.
binding-x
@
The name of the property that contains X values for the series. This value overrides
any binding set for the chart.
chart-type
@
The chart type to use in rendering objects for this series objects. This value overrides
the default chart type set on the chart. See ChartType.
.
css-class
@
The CSS class to use for the series.
items-source
=
An array or ICollectionView object that contains data for this series.
es.
name
52
Name
Description
@
The name of the series to show in the legend.
style
=
The series style. Use ng-attr-style to specify the series style object as an object. See
See
the section on ngAttr attribute bindings in AngularJS Creating Custom Directives and
and
the FlexChart 101 Styling Series sample for more information.
n.
symbol-marker
@
The shape of marker to use for the series. This value overrides the default marker set
on the chart. See Marker.
.
symbol-size
@
The size of the symbols used to render data points in this series for Scatter,
LineSymbols, and SplineSymbols charts, in pixels. This value overrides any set at the
chart level.
symbol-style
=
The style of the symbols used to render data points in this series for Scatter,
LineSymbols, and SplineSymbols charts. This value overrides any setting at the chart
level.
visibility
=
The SeriesVisibility value indicating whether and where to display the series.
es.
sample-count
@
The sample count for the calculation.
min
@
The minimum value of the parameter for calculating a function.
max
@
The maximum value of the parameter for calculating a function.
func
@
The function used to calculate Y value.
WjFlexGrid
AngularJS directive for the FlexGrid control.
l.
Use the wj-flex-grid directive to add grids to your AngularJS applications. Note that directive
ective
and parameter names must be formatted as lower-case with dashes instead of camel-case. For
For
example:
<p>Here is a FlexGrid control:</p>
51
Name
Description
<wj-flex-grid items-source="data">
">
<wj-flex-grid-column
mn
header="Country"
binding="country">
</wj-flex-grid-column>
mn>
<wj-flex-grid-column
mn
header="Sales"
binding="sales">
</wj-flex-grid-column>
mn>
<wj-flex-grid-column
mn
header="Expenses"
binding="expenses">
</wj-flex-grid-column>
mn>
<wj-flex-grid-column
mn
header="Downloads"
binding="downloads">
</wj-flex-grid-column>
mn>
</wj-flex-grid>
>
The example below creates a FlexGrid control and binds it to a 'data' array exposed by the
controller. The grid has three columns, each corresponding to a property of the objects
contained in the source array.
Live Example
The wj-flex-grid directive supports the following attributes:
butes:
allow-add-new
w
@
A value indicating whether to show a new row template so users can add items to the
source collection.
allow-delete
@
A value indicating whether the grid deletes the selected rows when the Delete key is
pressed.
allow-dragging
@
An AllowDragging value indicating whether and how the user can drag rows and
and
columns with the mouse.
allow-merging
VB.NET Create PDF Library SDK to convert PDF from other file Best VB.NET component to convert Microsoft Office Word Create and save editable PDF with a blank page Create fillable PDF document with fields in Visual Basic
create a fillable pdf form from a word document; convert word form to pdf fillable form
57
Name
Description
@
An AllowMerging value indicating which parts of the grid provide cell merging.
ing.
allow-resizing
@
An AllowResizing value indicating whether users are allowed to resize rows and
s and
columns with the mouse.
allow-sorting
@
A boolean value indicating whether users can sort columns by clicking the column
headers.
auto-generate-columns
s
@
A boolean value indicating whether the grid generates columns automatically based
on the items-source.
.
child-items-path
h
@
The name of the property used to generate child rows in hierarchical grids (or an
array of property names if items at different hierarchical levels use different names for
their child items).
control
=
A reference to the FlexGrid control created by this directive.
ve.
defer-resizing
=
A boolean value indicating whether row and column resizing should be deferred until
the user releases the mouse button.
frozen-columns
@
The number of frozen (non-scrollable) columns in the grid.
frozen-rows
@
The number of frozen (non-scrollable) rows in the grid.
group-header-format
t
@
The format string used to create the group header content.
headers-visibility
=
A HeadersVisibility value indicating whether the row and column headers are
are
visible.
ime-enabled
@
Gets or sets a value that determines whether the grid should support Input Method
Editors (IME) while not in edit mode.
initialized
&
This event occurs after the binding has finished initializing the control with attribute
values.
67
Name
Description
is-initialized
=
A value indicating whether the binding has finished initializing the control with
attribute values.
item-formatter
=
A function that customizes cells on this grid.
items-source
=
An array or ICollectionView object that contains the items shown on the grid.
id.
is-read-only
y
@
A boolean value indicating whether the user is prevented from editing grid cells by
typing into them.
merge-manager
=
A MergeManager object that specifies the merged extent of the specified cell.
ll.
selection-mode
@
A SelectionMode value indicating whether and how the user can select cells.
ls.
show-groups
@
A boolean value indicating whether to insert group rows to delimit data groups.
show-sort
@
A boolean value indicating whether to display sort indicators in the column headers.
sort-row-index
x
@
A number specifying the index of row in the column header panel that shows and
changes the current sort.
tree-indent
@
The indentation, in pixels, used to offset row groups of different levels.
beginning-edit
&
Handler for the beginningEdit event.
t.
cell-edit-ended
d
&
Handler for the cellEditEnded event.
t.
cell-edit-ending
g
&
Handler for the cellEditEnding event.
t.
prepare-cell-for-edit
dit
&
Handler for the prepareCellForEdit event.
t.
resizing-column
&
Handler for the resizingColumn event.
t.
resized-column
&
Handler for the resizedColumn event.
nt.
76
Name
Description
dragged-column
&
Handler for the draggedColumn event.
t.
dragging-column
&
Handler for the draggingColumn event.
nt.
sorted-column
&
Handler for the sortedColumn event.
t.
sorting-column
&
Handler for the sortingColumn event.
t.
deleting-row
&
Handler for the deletingRow event.
t.
dragging-row
&
Handler for the draggingRow event.
t.
dragged-row
&
Handler for the draggedRow event.
t.
resizing-row
&
Handler for the resizingRow event.
t.
resized-row
&
Handler for the resizedRow event.
t.
row-added
&
Handler for the rowAdded event.
t.
row-edit-ended
d
&
Handler for the rowEditEnded event.
t.
row-edit-ending
g
&
Handler for the rowEditEnding event.
t.
loaded-rows
&
Handler for the loadedRows event.
t.
loading-rows
&
Handler for the loadingRows event.
t.
group-collapsed-changed
d
&
Handler for the groupCollapsedChanged event.
t.
group-collapsed-changing
g
&
Handler for the groupCollapsedChanging event.
t.
items-source-changed
d
&
Handler for the itemsSourceChanged event.
t.
selection-changing
54
Name
Description
&
Handler for the selectionChanging event.
t.
selection-changed
&
Handler for the selectionChanged event.
t.
got-focus
&
The gotFocus event handler.
r.
lost-focus
&
The lostFocus event handler.
r.
scroll-position-changed
d
&
Handler for the scrollPositionChanged event.
t.
The wj-flex-grid directive may
ve may
contain WjFlexGridColumn, WjFlexGridCellTemplate and WjFlexGridDetail child
child
directives.
WjFlexGridCellTemplate
AngularJS directive for the FlexGrid cell templates.
s.
The wj-flex-grid-cell-template directive defines a template for a certain cell type
cell type
in FlexGrid, and must contain a cell-type attribute that specifies the CellTemplateType.
plateType.
Depending on the template's cell type, the wj-flex-grid-cell-template directive must be a child
be a child
of either WjFlexGrid or WjFlexGridColumn directives.
tives.
Column-specific cell templates must be contained in wj-flex-grid-column directives, and cells
and cells
that are not column-specific (like row header or top left cells) must be contained in the wj-
wj-
flex-grid directive.
In addition to an HTML fragment, wj-flex-grid-cell-template directives may contain an ng-
n an ng-
-
style or ng-class attribute that provides conditional formatting for cells.
ells.
Both the ng-style/ng-class attributes and the HTML fragment can use
can use
the $col, $row and $item template variables that refer to
refer to
the Column, Row and Row.dataItem objects pertaining to the cell.
the cell.
Documents you may be interested
Documents you may be interested
