數據
.html
. ts
根據實際的需要定義需要傳入的數據
定義圖表
注頁面的函數render（）是觸發圖表的行成的關鍵點，圖表的形成需要一個點或時機（歡迎小伙伴提出更好的點）
裝載數據
定義坐標系
以下實例是定義柱狀圖的坐標系，折線圖
以下實例是定義餅圖的坐標系
以下是對坐標系的說明
| coordType | 說明 |
| rect | 直角坐標系，目前僅支持二維，由 x, y 兩個互相垂直的坐標軸構成。 |
| polar | 極坐標系，由角度和半徑 2 個維度構成。 |
| theta | 一種特殊的極坐標系，半徑長度固定，僅僅將數據映射到角度，常用於餅圖的繪制。 |
| helix | 螺旋坐標系，基於阿基米德螺旋線。 |
定義圖例
坐標軸列定義
坐標軸定義
若是需要對坐標軸標題的樣式修改可以如下寫
定義tooltip提示信息
自定義顯示的提示信息 結果會是 x:m%
自定義圖表數據的顏色
定義圖表類型
其中定義餅圖還需要定義如下的內容
最后更新圖表
當圖表是需要不同時機下刷新時還需要更新數據
刷新圖表數據的語句需要放在自定義圖表頁面加載方法或者數據改變引發頁面加載的方法中，這樣圖表的數據才會更新
此處的環境是Angular 它的ngOnChanges()事件表示：
當 Angular（重新）設置數據綁定輸入屬性時響應。 該方法接受當前和上一屬性值的 SimpleChanges 對象
在ngOnInit() 之前以及所綁定的一個或多個輸入屬性的值發生變化時都會調用。
柱狀圖
以下是完整的自定義柱狀圖的.ts文件
具體參考：
G2 阿里官方： https://g2.antv.vision/zh/examples/gallery
語雀： https://www.yuque.com/antv/g2-docs