---
# System prepended metadata

title: Vision Framework UI Documentation

---

# Vision Framework UI Documentation

## Overview



## Visualization Components

* **Chart**
    * Contains configuration for an entire Vega visualization. All inner elements and configurations are parsed into a single Vega visualization.
    ```
    <Chart>
    </Chart>
    ```
    


## Notes
test.ts
```
import { VizZoom, VizClick } from '...'

@Component
class TestComponent implements VizZoom, VizClick {

    onZoom() {
        
    }
    
    //how to configure what to actually target
    onClick() {}
}
```

test.html
```
<Chart>
    <Axes />
    <Bar />
    <legend />
    
</Chart>
```

rectangles(rect)
plotting symbols (symbol)
general paths or polygons (path) 
circular arcs (arc) 
filled areas (area) 
lines (line)
images (image)
text labels (text) 
chart gridlines or rules (rule)

Input Properties
```
renderType = canvas | svg
data (would this e input property or component)
```

Services

```
public class DataHandler {

}

public class DataHandlerFramework{

}
```

```
public class VizApi<T extends DataHandler> {

}
```

Events?