> For the complete documentation index, see [llms.txt](https://harmoware-vis.gitbook.io/harmoware-vis-documents/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://harmoware-vis.gitbook.io/harmoware-vis-documents/api/container.md).

# Container

&#x20;This is the class inherited from `React.Component`. This is the base component of the `Harmoware-VIS` library which updates `settime` and `animation frame`. Please output DOM with the `render` method.

#### Examples

```jsx
// using mapbox
import React from 'react';
import {
  Container, connectToHarmowareVis, HarmoVisLayers, ...
} from 'harmoware-vis';

class App extends Container {
  render() {
    const { viewport, actions, ... } = this.props;
    return (
      <HarmoVisLayers
        viewport={viewport}  actions={actions}
        mapboxApiAccessToken={ ... } layers={[ ... ]}
      />
    );
  }
}

export default connectToHarmowareVis(App);
```
