Spark Data components are currently in beta.
Spark Data components need to be initialized before being used.
gux-chart-scatter-plot-beta
Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
| chartData | chart-data | Data to be rendered in the chart. Data field names must match the values you set in xFieldName and yFieldName | { [x: string]: any; } | undefined |
| colorFieldName | color-field-name | Type of category to plot in the chart | string | undefined |
| domainColor | domain-color | Optional domain line color | string | VisualizationColorUtil.DEFAULT_DOMAIN_COLOR |
| embedOptions | embed-options | EmbedOptions<string, Renderers> | undefined | |
| includeLegend | include-legend | boolean | undefined | |
| labelColor | label-color | Optional label color | string | VisualizationColorUtil.DEFAULT_LABEL_COLOR |
| legendPosition | legend-position | "bottom" | "bottom-left" | "bottom-right" | "left" | "none" | "right" | "top" | "top-left" | "top-right" | 'right' | |
| legendTitle | legend-title | Title to display above the optional legend | string | undefined |
| useShape | use-shape | The shape of the plotting in the chart - Square, Circle and Point | string | undefined |
| xAxisTitle | x-axis-title | Title to display along the x-axis | string | undefined |
| xFieldName | x-field-name | Name for the data field to use to populate the chart's x-axis e.g. xFieldName of "category" will map any "category" fields in chartData to the x-axis | string | undefined |
| xTickLabelSlant | x-tick-label-slant | If true, then make Axis tick label 45 degrees | boolean | undefined |
| yAxisTitle | y-axis-title | Title to display along the y-axis | string | undefined |
| yFieldName | y-field-name | Name for the data field to use to populate the chart's x-axis e.g. yFieldName of "value" will map any "value" fields in chartData to the y-axis | string | undefined |
Dependencies
Depends on
Graph
graph TD;
gux-chart-scatter-plot-beta --> gux-visualization-beta
style gux-chart-scatter-plot-beta fill:#f9f,stroke:#333,stroke-width:4px
Built with StencilJS