Layout - VegaColorEncodingSpecifier

Layout.VegaColorEncodingSpecifier

Define 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

StringType ? VegaDiscreteColorEncodingFinalizer : V extends DateTimeType | NumericType ? VegaContinuousColorEncodingFinalizer : never

Define an x series within a

Scatter chart 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

StringType ? VegaDiscreteColorEncodingFinalizer : V extends DateTimeType | NumericType ? VegaContinuousColorEncodingFinalizer : never

Example

  // use a DictType stream
  const stream = Stream(
      "My Stream",
      DictType(
          StringType,
          StructType({
              string: StringType,
              integer: StringType,
              integer_two: StringType,
              date: DateTimeType,
              float: FloatType,
          })
      )
  );
  
  // create a vega specification in a layout
  const layout = new LayoutBuilder("My Layout")
      .vega("My Chart", builder => builder
         .fromStream(stream)
         .scatter({
             x: (fields) => fields.date,
             y: (fields) => fields.integer,
             color: (fields) => fields.string,
             size: (fields) => fields.float,
         })
         .x({
             value: (fields) => fields.integer_two,
             title: "Other Integer"
         })
      ))
      .toTemplate()