ngOnInit()

in src/app/main/main.component.ts [150:194]


  ngOnInit() {
    this.columns = [];
    this.columnNames = [];
    this.geoColumnNames = [];
    this.rows = [];

    // Read parameters from URL
    this.projectID = this._route.snapshot.paramMap.get('project');
    this.dataset = this._route.snapshot.paramMap.get('dataset');
    this.table = this._route.snapshot.paramMap.get('table');
    this.jobID = this._route.snapshot.paramMap.get('job');
    this.location = this._route.snapshot.paramMap.get('location') || ''; // Empty string for 'Auto Select'
    this.sharingId = this._route.snapshot.queryParams['shareid'];

    // Data form group
    this.dataFormGroup = this._formBuilder.group({
      projectID: ['', Validators.required],
      sql: ['', Validators.required],
      location: [''],
    });
    this.dataFormGroup.controls.projectID.valueChanges.pipe(debounceTime(200)).subscribe(() => {
      this.dataService.getProjects()
        .then((projects) => {
          this.matchingProjects = projects.filter((project) => {
            return project['id'].indexOf(this.dataFormGroup.controls.projectID.value) >= 0;
          });
        });
    });

    // Schema form group
    this.schemaFormGroup = this._formBuilder.group({geoColumn: ['']});

    // Style rules form group
    const stylesGroupMap = {};
    StyleProps.forEach((prop) => stylesGroupMap[prop.name] = this.createStyleFormGroup());
    this.stylesFormGroup = this._formBuilder.group(stylesGroupMap);

    // Sharing form group
    this.sharingFormGroup = this._formBuilder.group({
      sharingUrl: '',
    });

    // Initialize default styles.
    this.updateStyles();
  }