I dont want a button

Ionic Framework ionic-v3
#1

this is my code in my ionic

HTML

<ion-header>
    <ion-navbar color="primary">
      <button ion-button menuToggle>
        <ion-icon name="menu"></ion-icon>
      </button>
     
      <ion-title>
        Timeline Chart
      </ion-title>
      
    </ion-navbar>
  </ion-header>

<ion-content padding>

<div style="text-align:center">
  <button ion-button (click) = "showChart()">
    Show Chart
  </button>
  <button ion-button (click) = "showDetail()">
    Show Detail
  </button>
</div>   
  <div id = "timeline" style="overflow-x: auto;"></div>
</ion-content>

TypeScript

import { Component, ViewChild } from '@angular/core';
import { Storage } from '@ionic/storage';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Chart } from 'chart.js';
import { RestserviceProvider } from'../../providers/restservice/restservice'
import { LeavedetailPage } from '../leavedetail/leavedetail'
/**
 * Generated class for the Test2Page page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

declare var google;

@IonicPage()
@Component({
  selector: 'page-test2',
  templateUrl: 'test2.html',
})

  
 
export class Test2Page {
  chart:any;
  TodayWhoLeave:any;
  data_need:Array<{Name:any,LeaveType:any,StartDate:any,EndDate:any,Duration:any}> = [];

  // container:any;
  // data:any;
  // option:any;

  getday1:any;
  day1:any;
  getday7:any;
  day7:any;
  
  constructor(public navCtrl: NavController,public ReceiveData:RestserviceProvider) {
    //google.charts.setOnLoadCallback(this.showChart());

    this.ReceiveData.load()
    .then(data=>{
      this.TodayWhoLeave = data;
      
      //讀取所需的資料，資料已在provider處理過
     for(let j = 0 ; j < this.TodayWhoLeave.length ; j++){
       this.data_need.push({
         Name:this.TodayWhoLeave[j].Name,
         LeaveType:this.TodayWhoLeave[j].LeaveType,
         StartDate:this.TodayWhoLeave[j].StartDate.slice(0,10),
         EndDate:this.TodayWhoLeave[j].EndDate.slice(0,10),
         Duration:this.TodayWhoLeave[j].Duration
       })       
     }
      console.log(this.data_need);
    })
  }

  showChart(){
    // Create the data table.
      
      var container = document.getElementById('timeline');
      var chart = new google.visualization.Timeline(container);

      var data  = new google.visualization.DataTable();
        data.addColumn({ type: 'string', id: 'LeaveType'});
        data.addColumn({ type: 'string', id: 'Name' });  
        data.addColumn({ type: 'date', id: 'Start' });
        data.addColumn({ type: 'date', id: 'End' });

        data.addRows(this.data_need.length);        
        for(let i = 0 ; i < this.data_need.length ; i++){
          data.setCell(i,0,this.data_need[i].Name);
          data.setCell(i,1,this.data_need[i].LeaveType);
          data.setCell(i,2,new Date(this.data_need[i].StartDate));
          data.setCell(i,3,new Date(this.data_need[i].EndDate));
        }
        
        //調整表格樣式 在上面的部分解決
        var options = {
          timeline: {
            colorByRowLabel :true , //使假別顏色一致
          }, 
          //設定圖表大小
          'width':1125, 
          'height':2436,
          colors:['#c2c2d6', '#eeccaa', '#e2cdb6', '#e6b3b3'],
        };
          
      // dashboard.bind(control, chart);
      chart.draw(data,options);
        
  }

  ToGetDay(){
    this.getday1 = new Date();
    var bejson = JSON.stringify(this.getday1);
    this.day1 = bejson.slice(1,11)
    
    this.getday7 = new Date();
    this.getday7.setDate(this.getday7.getDate()+6);
    bejson = JSON.stringify(this.getday7);
    this.day7 = bejson.slice(1,11)    


    console.log(this.day1);
    console.log(this.day7);
  }
  


  showDetail(){
    this.navCtrl.push(LeavedetailPage);
  }
}

I want the HTML can show the chart without any button .What should i do?

thank a lot

#2