Options
All
  • Public
  • Public/Protected
  • All
Menu

Class PlotlyChart<SS>

React wrapper for a Plotly Chart.

description

Based upon: https://github.com/davidctj/react-plotlyjs-ts

export
extends

{React.Component<IPlotlyChartProps, any>}

Type parameters

  • SS

Hierarchy

Index

Constructors

constructor

Properties

Protected canvasRef

canvasRef: HTMLDivElement | null = null

context

context: any

If using the new style context, re-declare this in your class to be the React.ContextType of your static contextType. Should be used with type annotation or static contextType.

static contextType = MyContext
// For TS pre-3.7:
context!: React.ContextType<typeof MyContext>
// For TS 3.7 and above:
declare context: React.ContextType<typeof MyContext>
see

https://reactjs.org/docs/context.html

Protected isDoubleClickInProgress

isDoubleClickInProgress: boolean = false

plotlyCanvas

plotlyCanvas: PlotlyHTMLElement | null = null

Protected plotlyFormattedData

plotlyFormattedData: Array<Partial<IPlotlyData>> = []

props

props: Readonly<IPlotlyChartProps> & Readonly<object>

refs

refs: object

Type declaration

  • [key: string]: ReactInstance

Protected renderTimeout

renderTimeout: undefined | Timer | number

Protected Optional savedAxisZoom

savedAxisZoom: undefined | object

Protected Optional savedCameraScene

savedCameraScene: plotly.Camera

state

state: Readonly<any>

Static Optional contextType

contextType: Context<any>

If set, this.context will be set at runtime to the current value of the given Context.

Usage:

type MyContext = number
const Ctx = React.createContext<MyContext>(0)

class Foo extends React.Component {
  static contextType = Ctx
  context!: React.ContextType<typeof Ctx>
  render () {
    return <>My context's value: {this.context}</>;
  }
}
see

https://reactjs.org/docs/context.html#classcontexttype

Methods

Optional UNSAFE_componentWillMount

  • UNSAFE_componentWillMount(): void

Optional UNSAFE_componentWillReceiveProps

  • UNSAFE_componentWillReceiveProps(nextProps: Readonly<IPlotlyChartProps>, nextContext: any): void

Optional UNSAFE_componentWillUpdate

  • UNSAFE_componentWillUpdate(nextProps: Readonly<IPlotlyChartProps>, nextState: Readonly<any>, nextContext: any): void

attachListeners

  • attachListeners(): void

Optional componentDidCatch

  • componentDidCatch(error: Error, errorInfo: ErrorInfo): void
  • Catches exceptions generated in descendant components. Unhandled exceptions will cause the entire component tree to unmount.

    Parameters

    • error: Error
    • errorInfo: ErrorInfo

    Returns void

componentDidMount

  • componentDidMount(): Promise<void>

componentDidUpdate

  • Determines if we should send a draw call to Plotly based on if data has actually changed.

    Parameters

    Returns Promise<void>

Optional componentWillMount

  • componentWillMount(): void

Optional componentWillReceiveProps

  • componentWillReceiveProps(nextProps: Readonly<IPlotlyChartProps>, nextContext: any): void

componentWillUnmount

  • componentWillUnmount(): void

Optional componentWillUpdate

  • componentWillUpdate(nextProps: Readonly<IPlotlyChartProps>, nextState: Readonly<any>, nextContext: any): void

Protected deriveAxisParams

  • Create [0-n] plotly axes given some plotly data.

    Parameters

    • allData: Array<Partial<IPlotlyData>>

      The already formatted Plotly data - meaning each data should have the proper axis already assigned.

    Returns Partial<IPlotlyLayout>

    A object containing xaxis and yaxis fields, as well as xaxis# and yaxis# fields where # is derived from the given data.

Protected deriveChartPiece

  • deriveChartPiece(xDatum: Plotly.Datum, yDatum: Plotly.Datum, data?: plotly.ScatterData): object

draw

  • draw(): Promise<void>

forceUpdate

  • forceUpdate(callback?: undefined | function): void
  • Parameters

    • Optional callback: undefined | function

    Returns void

Protected generateExtraPlotlyAxis

  • generateExtraPlotlyAxis(ids: Set<string>): Partial<IPlotlyLayout>

Protected generateExtraPlotlyAxisFromId

  • generateExtraPlotlyAxisFromId(id: string): object

Protected getMergedConfig

  • getMergedConfig(config?: Partial<Config>): Config

Protected getMergedLayout

Optional getSnapshotBeforeUpdate

  • getSnapshotBeforeUpdate(prevProps: Readonly<IPlotlyChartProps>, prevState: Readonly<any>): SS | null
  • Runs before React applies the result of render to the document, and returns an object to be given to componentDidUpdate. Useful for saving things such as scroll position before render causes changes to it.

    Note: the presence of getSnapshotBeforeUpdate prevents any of the deprecated lifecycle events from running.

    Parameters

    Returns SS | null

Private isDataLoaded

  • isDataLoaded(): boolean

Protected onAfterPlot

  • onAfterPlot(): void

Protected onClick

  • onClick(event: PlotMouseEvent): void

Protected onDoubleClick

  • onDoubleClick(): void

Protected onHover

  • onHover(event: PlotMouseEvent): void

Protected onLegendClick

  • onLegendClick(event: LegendClickEvent): boolean

Protected onRelayout

  • onRelayout(event: PlotRelayoutEvent & object): void

Protected onSelect

  • onSelect(event: PlotSelectionEvent): Promise<void>

Protected onUnHover

  • onUnHover(event: PlotMouseEvent): void

render

  • render(): Element

resize

  • resize(): void

setState

  • setState<K>(state: function | null | S | object, callback?: undefined | function): void
  • Type parameters

    • K: keyof any

    Parameters

    • state: function | null | S | object
    • Optional callback: undefined | function

    Returns void

Optional shouldComponentUpdate

  • shouldComponentUpdate(nextProps: Readonly<IPlotlyChartProps>, nextState: Readonly<any>, nextContext: any): boolean
  • Called to determine whether the change in props and state should trigger a re-render.

    Component always returns true. PureComponent implements a shallow comparison on props and state and returns true if any props or states have changed.

    If false is returned, Component#render, componentWillUpdate and componentDidUpdate will not be called.

    Parameters

    Returns boolean

Object literals

Static defaultProps

defaultProps: object

config

config: object

Type declaration

data

data: never[] = []

height

height: string = "100%"

layout

layout: object

Type declaration

showLoader

showLoader: boolean = true

width

width: string = "100%"

Generated using TypeDoc