react Architecture Docs
Home / Class/ Charts Class — react Architecture

Charts Class — react Architecture

Architecture documentation for the Charts class in Charts.js from the react codebase.

Class javascript BabelCompiler

Entity Profile

Dependency Diagram

graph TD
  f4df3a91_6c44_d711_f000_dd1eb50d4ac0["Charts"]
  7a306bc3_bbc5_e719_6911_64c744dcf0fd["Charts.js"]
  f4df3a91_6c44_d711_f000_dd1eb50d4ac0 -->|defined in| 7a306bc3_bbc5_e719_6911_64c744dcf0fd
  a9610b16_5cb9_beda_e5fc_ca410358d178["render()"]
  f4df3a91_6c44_d711_f000_dd1eb50d4ac0 -->|method| a9610b16_5cb9_beda_e5fc_ca410358d178

Relationship Graph

Source Code

fixtures/concurrent/time-slicing/src/Charts.js lines 14–126

export default class Charts extends PureComponent {
  render() {
    const streamData = this.props.data;
    return (
      <div>
        <div style={{display: 'flex'}}>
          <VictoryChart
            theme={VictoryTheme.material}
            width={400}
            height={400}
            style={{
              parent: {
                backgroundColor: '#222',
              },
            }}>
            <VictoryAxis
              style={{
                axis: {stroke: 'white'},
                tickLabels: {fill: 'white'},
              }}
            />
            <VictoryAxis
              style={{
                axis: {stroke: 'white'},
                tickLabels: {fill: 'white'},
              }}
              dependentAxis
            />
            <VictoryScatter
              data={streamData[0]}
              size={6}
              style={{
                data: {
                  fill: d => colors[d.x % 5],
                },
              }}
            />
          </VictoryChart>

          <VictoryChart
            theme={VictoryTheme.material}
            width={400}
            height={400}
            style={{
              parent: {
                backgroundColor: '#222',
              },
            }}
            domainPadding={[20, 20]}>
            <VictoryAxis
              style={{
                axis: {stroke: 'white'},
                tickLabels: {fill: 'white'},
              }}
            />
            <VictoryAxis
              style={{
                axis: {stroke: 'white'},
                tickLabels: {fill: 'white'},
              }}
              dependentAxis
            />
            <VictoryBar
              data={streamData[0]}
              style={{
                data: {
                  fill: d => colors[d.x % 5],
                  stroke: 'none',
                  padding: 5,
                },
              }}
            />
          </VictoryChart>
        </div>
        <div
          style={{
            display: 'flex',
            position: 'relative',
            top: '-50px',
          }}>
          <VictoryChart

Domain

Defined In

Source

Frequently Asked Questions

What is the Charts class?
Charts is a class in the react codebase, defined in fixtures/concurrent/time-slicing/src/Charts.js.
Where is Charts defined?
Charts is defined in fixtures/concurrent/time-slicing/src/Charts.js at line 14.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free