Layout - VegaFieldEncodingBuilder
Layout.VegaFieldEncodingBuilderDefine a UI Chart based on a Vega-Lite specification from a
Stream within a LayoutBuilder.Remarks
See
Vega-Lite for more information about specifications.Type parameters
Name | Type |
---|---|
T | extends DictType | ArrayType = DictType | ArrayType |
E | extends PrimitiveType = PrimitiveType |
Layout
value
▸ value(f
): V
extends
DateTimeType
? VegaDateTimeEncodingFinalizer
: V
extends IntegerType
? VegaIntegerEncodingFinalizer
: V
extends FloatType
? VegaFloatEncodingFinalizer
: V
extends StringType
? VegaStringEncodingFinalizer
: never
Define a vega field encoding for a
VegaBuilder within a LayoutBuilder.Type parameters
Name | Type |
---|---|
F | extends TypeToFields <DictType > | ArrayToFields <ArrayType > |
V | extends PrimitiveType = E |
Parameters
Name | Type |
---|---|
f | (fields : F ) => EastFunction |
Returns
V
extends
DateTimeType
? VegaDateTimeEncodingFinalizer
: V
extends IntegerType
? VegaIntegerEncodingFinalizer
: V
extends FloatType
? VegaFloatEncodingFinalizer
: V
extends StringType
? VegaStringEncodingFinalizer
: never
Example
// use a DictType stream
const stream = Stream(
"My Stream",
DictType(
StringType,
StructType({
string: StringType,
date: DateTimeType,
float: FloatType,
})
)
);
// create a vega specification in a layout
const layout = new LayoutBuilder("My Layout")
.vega("My Vega-Lite Chart", builder => builder
.view(
builder => builder
.fromStream(stream)
.heatmap({
x: builder => builder
.value(fields => fields.date)
.title("X Title")
.sort('descending'),
y: builder => builder
.value(fields => fields.float)
.title("Y Title")
.sort('ascending'),
color: builder => builder
.value(fields => fields.string)
.title("Color Title")
})
)
))
.toTemplate()