Skip to main content
cngx-src documentation

CngxScatter

ComponentPrimaryOnPushNo encapsulationv0.1.0

projects/common/chart/layers/scatter.component.ts

GitHub

Import#

import { CngxScatter } from '@cngx/common/chart'

Description#

Scatter layer atom. Renders one <circle> per datapoint. X and Y accessors are independent - neither defaults to index, since the defining trait of a scatter chart is two genuine data dimensions.

Attribute-selector on <svg:g> - see CngxLine for why.

https://cngxjs.github.io/cngx/examples/#/common/chart/primitives/async-state-machine-on-the-primitive https://cngxjs.github.io/cngx/examples/#/common/chart/primitives/combo-bars-moving-average-line https://cngxjs.github.io/cngx/examples/#/common/chart/primitives/line-area-threshold-band https://cngxjs.github.io/cngx/examples/#/common/chart/primitives/multi-series-line-axis-labels-legend https://cngxjs.github.io/cngx/examples/#/common/chart/primitives/responsive-fills-parent-width https://cngxjs.github.io/cngx/examples/#/common/chart/primitives/scatter-with-performance-zones https://cngxjs.github.io/cngx/examples/#/common/chart/primitives/time-series-with-threshold-zones

Related#

Metadata#

Selector
[cngxScatter]
Export as
cngxScatter
Change detection
ChangeDetectionStrategy.OnPush
Encapsulation
ViewEncapsulation.None
Implements
CngxChartLayer

Providers#

CNGX_CHART_LAYER
useExisting CngxScatter

Relationships

Depends on1

CNGX_CHART_LAYERservice

Index#

Properties

ctx

Inputs

colordataradiusxy

Derived State

circlesgeometry

Inputs#

color#string | null
input()
default null
data#readonly T[] | undefined
input()
radius#number
input()
default 3

Instance Properties#

ctx#unknown
ProtectedReadonly
injectChartContext('CngxScatter')
Enter to selectArrow Down Arrow Up to navigateEsc to close