From a8f673852a8c6ef18e3eff81210df0a51921cb37 Mon Sep 17 00:00:00 2001
From: JUNUUBALAROHITH <102303532+JUNUUBALAROHITH@users.noreply.github.com>
Date: Tue, 14 Mar 2023 20:04:47 +0530
Subject: [PATCH] Update Graph.tsx

---
 src/Graph.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/Graph.tsx b/src/Graph.tsx
index 3b2a7da1a38..6c1fd963e1c 100644
--- a/src/Graph.tsx
+++ b/src/Graph.tsx
@@ -14,7 +14,7 @@ interface IProps {
  * Perspective library adds load to HTMLElement prototype.
  * This interface acts as a wrapper for Typescript compiler.
  */
-interface PerspectiveViewerElement {
+interface PerspectiveViewerElement extends HTMLElement {
   load: (table: Table) => void,
 }
 
@@ -32,7 +32,7 @@ class Graph extends Component<IProps, {}> {
 
   componentDidMount() {
     // Get element to attach the table from the DOM.
-    const elem: PerspectiveViewerElement = document.getElementsByTagName('perspective-viewer')[0] as unknown as PerspectiveViewerElement;
+    const elem = document.getElementsByTagName('perspective-viewer')[0] as unknown as PerspectiveViewerElement;
 
     const schema = {
       stock: 'string',
@@ -49,7 +49,13 @@ class Graph extends Component<IProps, {}> {
 
       // Add more Perspective configurations here.
       elem.load(this.table);
+      element.setAttribute('view','y_line');
+      element.setAttribute('column-pivots','["stock"]');
+      element.setAttribute('row-pivots','["timestamp"]');
+      element.setAttribute('columns','["top_ask_price"]');
+      element.setAttribute('aggregates',{"stock":"distinct count","top_ask_price":"avg","top_bid_price":"avg","timestamp":"distinct count"}');
     }
+
   }
 
   componentDidUpdate() {