Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
The Effect Scatter Chart is a chart that shows the relationship between two variables. They are an incredibly powerful chart type, allowing viewers to immediately understand a relationship or trend, which would be impossible to see in almost any other form. the effect intensify the point that the user want to difference along all others.
You can find a more in depth explanation about the Effect Scatter on this page:
https://echarts.apache.org/examples/en/editor.html?c=scatter-effect
Properties of Effect Scatter Chart
WEM Modeler has many widgets to enhance User Interaction.
For some (older) demos and documentation on existing widgets, you can visit
A Candlestick Chart (or Candle Chart) is a type of financial chart that describes the price changes of a security, derivative, or currency. Candlestick graphs and charts usually represent data as numerical values in vertical axes and compare the price movements across time, visualizing the open, high, low, and close values.
You can find a more in depth explanation about the candlestick chart on page:
Properties of Candle Stick Chart
Property Name | Data type | Type | Description |
---|
Property Name
Data type
Type
Description
Data Source
List
Data Model
Datalist source for the widget.
X axis
Number
Expression
Values displayed on x-axis.
These are expected to be numeric values.
Y axis
Number
Expression
Values displayed on y-axis.
These are expected to be numeric values.
Effect point
Boolean
Expression
Boolean that determines if a given point is has an effect.
SelectedValueOutputID
Text
To select the specific value of the scatter chart, to put the differentiator effect in the point.
Show Xaxis Scale
Boolean
Expression
Show de scale of the x axis.
Show Yaxis Scale
Boolean
Expression
Show de scale of the y axis.
Scatter points color
Text
Expression
Defines the color of the scatter chart points.
Effect Points Color
Text
Expression
Defines the color of the effect points.
Scatter Chart Symbols
Text
Dropdown
To change the style of the scatter symbol. (Cirlce, rect, roundrect, triangle, diamond, pin, arrow).
Effect symbol size
Number
Expression
to change the size of the effect symbol
Scatter symbol size
Number
Expression
to change the size of the symbol.
Height
Text
Expression
Set height of the chart.
Type number.
Width
Text
Expression
Set width of the chart.
Type number.
Data source | List | Data Model | Data list source for the widget. |
X axis date | Date | Expression | Date values displayed on x-axis. |
Y axis open | Number | Expression | Open price displayed on y-axis. |
Y axis high | Number | Expression | High price displayed on y-axis. |
Y axis low | Number | Expression | Low price displayed on y-axis. |
Y axis close | Number | Expression | Close price displayed on y-axis. |
Custom scale | Boolean |
| Change scale to a custom scale with custom properties. |
Use opposite scale | Boolean | Expression | Changes position of y axis values to the opposite position. |
Min scale value | Number | Expression | Minimum value for the scale. |
Max scale value | Number | Expression | Maximum value for the scale. |
Tick scale amount | Number | Expression | Number of visual ticks for the scale on the vertical axis. |
Show tooltip | Boolean | Expression | Show tooltip. Use true or false. |
X axis tooltip | Boolean | Expression | Show x-axis tooltip. |
Y axis tooltip | Boolean | Expression | Show y-axis tooltip. |
Label decimals | Number | Expression | Set number of decimals displayed for y-axis values. |
Theme | Text | Dropdown | Change the text and background colors of the chart. |
Upward color | Text | Expression | Upward color for the chart. |
Downward color | Text | Expression | Downward color for the chart. |
Background color | Text | Expression | Change the background color of the chart. It's important to set the opacity with the color to show the gridlines. Examples: "#FFFFFF60" or "rgba(255, 255, 255, 0.6)" |
Grid lines vertical | Boolean | Expression | Display vertical lines on the grid. |
Grid lines horizontal | Boolean | Expression | Display horizontal lines on the grid. |
Grid lines color | Text | Expression | Change color of the lines on the grid. Example: "#92a8d1" or "red" or "rgb(201, 76, 76)" or "rgba(201, 76, 76, 0.3)" |
Prefix | Text | Expression | Display a prefix for values on tooltip. |
Postfix | Text | Expression | Display a postfix for values on tooltip. |
Show animation | Boolean | Expression | Display animation on render. |
Height | Number | Expression | Set height of the chart. Type number. |
Width | Number | Expression | Set width of the chart. Type number. |
The Stacked Columns Chart shows the contribution to trends in the data. This is done by stacking lines on top of each other. Stacked Line charts are used with data that can be placed in an order, from low to high. The charts are used when you have more than one data column that all adds up to the total trend.
You can find a more in depth explanation about the stacked column on this page: https://apexcharts.com/javascript-chart-demos/column-charts/stacked/
Datamodel
The Stacked Columns Chart uses a single list or filtered list for its source values. This list has the fields for the Series and Categories on each row. From this list a field is selected for the 'Values', the widget will then iterate over this list and use the indicated field to generate the values shown in the widget. This field must be numeric type. The categories and series properties are then set to respective category and series field from the source list. So this list will contain the following:
Numeric field, for holding the values to show on the stack - per specific category and series
Text field, to hold the specific Category value that is displayed along the other axis from the values: for example, the Month Name to show values per month.
Text field, to hold the specific Series value for which the Value should be applied (like years, and if they hold a numeric value, just use the ToString([field]) in the widget property) for example to show the different Total Values for the same month in Categories but with a different color per year.
Properties of Stacked Columns Chart
A Box-plot chart is a visual representation displaying a given statistical data set based on a five-number summary: the minimum, the first quartile (25th percent), the median (second quartile), the third quartile (75th percent), and the maximum. Such charts are extremely useful for comparing distributions of values across categories. The Box-plot is also referred to as box plot, box-and-whisker plot, box-and-whisker diagram.These charts contain boxes and whiskers (vertical or horizontal lines that extend from the minimum to Quartile 1 and from Quartile 3 to the maximum).
You can find a more in depth explanation about the boxplot on this page:
Map morphing is an interactive visualization technique that provides a user-controlled, animated translation from one map to another. Traditionally, overlay mechanisms are used to present layers of information over a single projection. Map morphing provides a way to relate maps with significant spatial and schematic differences.
You can find a more in-depth explanation about the map bar morph on this page: https://echarts.apache.org/examples/en/editor.html?c=map-bar-morph
Properties of Map-Bar Morph
A heat map is a data visualization technique that shows magnitude of a phenomenon as color in two dimensions. The variation in color may be by hue or intensity, giving obvious visual cues to the reader about how the phenomenon is clustered or varies over space.
You can find a more in depth explanation about the Heat map on this page:
Properties of Heat Map