PriceLineLayerConfig

Examples

JSX - Minimal configuration

<PriceLine />

JSX - Full configuration

<PriceLine
  id="price-line"
  inputs={[{ key: 'input', source: { type: 'price', field: 'close' } }]}
  outputs={['price']}
  calculate={true}
  includeInAutoScale={true}
  series={{
    value: { width: 1, color: 'dodgerblue', style: 'solid', endDotSize: 5 },
  }}
  markers={{
    value: {
      mode: 'last-visible',
      line: { color: 'dodgerblue', width: 1, style: 'dashed', dashes: [5, 5] },
      label: { color: 'white', backgroundColor: 'dodgerblue' },
    },
  }}
  legend={{
    label: 'Close price',
    fields: [{ output: 'price', label: '', color: 'dodgerblue' }],
  }}
  yAxis={{ side: 'right', width: 80 }}
/>

Configuration Object - Full configuration

{
  id: 'price-line',
  type: 'price:line',
  inputs: [{ key: 'input', source: { type: 'price', field: 'close' } }],
  outputs: ['price'],
  calculate: true,
  includeInAutoScale: true,
  series: {
    value: {
      width: 1,
      color: 'dodgerblue',
      style: 'solid',
      endDotSize: 5,
    },
  },
  markers: {
    value: {
      mode: 'last-visible',
      line: {
        color: 'dodgerblue',
        width: 1,
        style: 'dashed',
        dashes: [5, 5],
      },
      label: {
        color: 'white',
        backgroundColor: 'dodgerblue',
      },
    },
  },
  legend: {
    label: 'Close price',
    fields: [{ output: 'price', label: '', color: 'dodgerblue' }],
  },
  yAxis: { side: 'right', width: 80 },
}

Properties

Base Props

BaseLayerConfig

series

• Type: { value?: false | LineConfig }

markers

• Type: { value?: false | ValueMarkerConfig }

TypeScript

interface PriceLineLayerConfig extends BaseLayerConfig {
  type: 'price:line';
  series?: { value?: false | LineConfig };
  markers?: { value?: false | ValueMarkerConfig };
}