<commit_before>import {Component, ElementRef, Input, OnInit, ViewRef} from '@angular/core';

import {
  HsDialogComponent,
  HsDialogContainerService,
  HsLanguageService,
} from 'hslayers-ng';
import {default as vegaEmbed} from 'vega-embed';

const CHART_DIV = '.hs-statistics-histogram';
export type HistogramData = {
  interval: string;
  frequency: number;
};
@Component({
  selector: 'hs-histogram-chart-dialog',
  templateUrl: './histogram-chart-dialog.component.html',
})
export class HsStatisticsHistogramComponent
  implements HsDialogComponent, OnInit
{
  viewRef: ViewRef;
  descStat: {
    median: number;
    modes: string;
    mean: number;
    meanAbsoluteDeviation: number;
    variance: number;
    standardDeviation: number;
    pearsonCoefficient: number;
  };
  histogram: HistogramData[] = [];
  @Input() data: {
    filteredValues: any[];
    selectedTime: any;
    min: number;
    max: number;
    selectedVariable: string;
  };
  constructor(
    public hsDialogContainerService: HsDialogContainerService,
    private elementRef: ElementRef,
    public hsLanguageService: HsLanguageService
  ) {}
  ngOnInit(): void {
    if (this.isDataLoaded()) {
      this.setToDefault();
      this.executeCalculations();
      this.visualize();
    }
  }

  isDataLoaded(): boolean {
    return this.data.filteredValues.length > 0;
  }

  setToDefault(): void {
    this.descStat = {
      median: 0,
      modes: '',
      mean: 0,
      meanAbsoluteDeviation: 0,
      variance: 0,
      standardDeviation: 0,
      pearsonCoefficient: 0,
    };
  }

  executeCalculations(): void {
    this.descStat.mean = this.calculateMean(this.data.filteredValues);
    this.calculateVariance(this.data.filteredValues, this.descStat.mean);
    this.calculateMedian(this.data.filteredValues);
    this.calculateMode(this.data.filteredValues);
    this.calculateMeanAbsoluteDeviation(this.data.filteredValues);
    this.calculateSD();
    this.calculatePearsonCoefficient(
      this.descStat.mean,
      this.descStat.median,
      this.descStat.standardDeviation
    );
  }
  close(): void {
    this.hsDialogContainerService.destroy(this);
  }

  visualize(): void {
    const chartDiv = this.elementRef.nativeElement.querySelector(CHART_DIV);
    this.findAndSetIntervals();
    const width = chartDiv.parentElement.offsetWidth - 40;
    const height = chartDiv.parentElement.offsetHeight - 40;

    const chartData: any = {
      '$schema': 'https://vega.github.io/schema/vega/v5.json',
      'width': width,
      'height': height,
      'autosize': {
        'type': 'fit',
        'contains': 'padding',
      },
      'config': {
        'axis': {
          'labelColor': 'black',
          'labelFontSize': 10,
          'titleFontSize': 16,
          'titleFontWeight': '600',
        },
      },
      'data': [
        {
          'name': 'table',
          'values': this.histogram,
        },
      ],
      'signals': [
        {
          'name': 'tooltip',
          'value': {},
          'on': [
            {'events': 'rect:mouseover', 'update': 'datum'},
            {'events': 'rect:mouseout', 'update': '{}'},
          ],
        },
      ],

      'scales': [
        {
          'name': 'xscale',
          'type': 'band',
          'range': 'width',
          'domain': {'data': 'table', 'field': 'interval'},
          'round': true,
          'padding': 0.1,
        },
        {
          'name': 'yscale',
          'range': 'height',
          'domain': {'data': 'table', 'field': 'frequency'},
          'nice': true,
        },
      ],

      'axes': [
        {
          'orient': 'bottom',
          'scale': 'xscale',
          'bandPosition': 0.5,
          'title': this.hsLanguageService.getTranslation(
            'STATISTICS.INTERVALS'
          ),
          'labelAngle': 15,
          'labelBaseline': 'line-top',
          'titleY': 40,
        },
        {
          'orient': 'left',
          'scale': 'yscale',
          'title': this.hsLanguageService.getTranslation(
            'STATISTICS.FREQUENCY'
          ),
          'tickMinStep': 1,
        },
      ],

      'marks': [
        {
          'type': 'rect',
          'from': {'data': 'table'},
          'encode': {
            'enter': {
              'x': {'scale': 'xscale', 'field': 'interval'},
              'width': {'scale': 'xscale', 'band': 1},
              'y': {'scale': 'yscale', 'field': 'frequency'},
              'y2': {'scale': 'yscale', 'value': 0},
            },
            'update': {
              'fill': {'value': 'steelblue'},
              'fillOpacity': {'value': 0.4},
            },
            'hover': {
              'fill': {'value': 'red'},
            },
          },
        },
        {
          'type': 'text',
          'encode': {
            'enter': {
              'align': {'value': 'center'},
              'baseline': {'value': 'top'},<commit_msg>feat: Added line data type to histogram<commit_after>import {Component, ElementRef, Input, OnInit, ViewRef} from '@angular/core';

import {
  HsDialogComponent,
  HsDialogContainerService,
  HsLanguageService,
} from 'hslayers-ng';
import {default as vegaEmbed} from 'vega-embed';

const CHART_DIV = '.hs-statistics-histogram';
export type HistogramData = {
  interval: string;
  frequency: number;
};
@Component({
  selector: 'hs-histogram-chart-dialog',
  templateUrl: './histogram-chart-dialog.component.html',
})
export class HsStatisticsHistogramComponent
  implements HsDialogComponent, OnInit {
  viewRef: ViewRef;
  descStat: {
    median: number;
    modes: string;
    mean: number;
    meanAbsoluteDeviation: number;
    variance: number;
    standardDeviation: number;
    pearsonCoefficient: number;
  };
  histogram: HistogramData[] = [];
  @Input() data: {
    filteredValues: any[];
    selectedTime: any;
    min: number;
    max: number;
    selectedVariable: string;
  };
  constructor(
    public hsDialogContainerService: HsDialogContainerService,
    private elementRef: ElementRef,
    public hsLanguageService: HsLanguageService
  ) {}
  ngOnInit(): void {
    if (this.isDataLoaded()) {
      this.setToDefault();
      this.executeCalculations();
      this.visualize();
    }
  }

  isDataLoaded(): boolean {
    return this.data.filteredValues.length > 0;
  }

  setToDefault(): void {
    this.descStat = {
      median: 0,
      modes: '',
      mean: 0,
      meanAbsoluteDeviation: 0,
      variance: 0,
      standardDeviation: 0,
      pearsonCoefficient: 0,
    };
  }

  executeCalculations(): void {
    this.descStat.mean = this.calculateMean(this.data.filteredValues);
    this.calculateVariance(this.data.filteredValues, this.descStat.mean);
    this.calculateMedian(this.data.filteredValues);
    this.calculateMode(this.data.filteredValues);
    this.calculateMeanAbsoluteDeviation(this.data.filteredValues);
    this.calculateSD();
    this.calculatePearsonCoefficient(
      this.descStat.mean,
      this.descStat.median,
      this.descStat.standardDeviation
    );
  }
  close(): void {
    this.hsDialogContainerService.destroy(this);
  }

  visualize(): void {
    const chartDiv = this.elementRef.nativeElement.querySelector(CHART_DIV);
    this.findAndSetIntervals();
    const width = chartDiv.parentElement.offsetWidth - 40;
    const height = chartDiv.parentElement.offsetHeight - 40;

    const chartData: any = {
      '$schema': 'https://vega.github.io/schema/vega/v5.json',
      'width': width,
      'height': height,
      'autosize': {
        'type': 'fit',
        'contains': 'padding',
      },
      'config': {
        'axis': {
          'labelColor': 'black',
          'labelFontSize': 10,
          'titleFontSize': 16,
          'titleFontWeight': '600',
        },
      },
      'data': [
        {
          'name': 'table',
          'values': this.histogram,
        },
      ],
      'signals': [
        {
          'name': 'tooltip',
          'value': {},
          'on': [
            {'events': 'rect:mouseover', 'update': 'datum'},
            {'events': 'rect:mouseout', 'update': '{}'},
          ],
        },
      ],

      'scales': [
        {
          'name': 'xscale',
          'type': 'band',
          'range': 'width',
          'domain': {'data': 'table', 'field': 'interval'},
          'round': true,
          'padding': 0.1,
        },
        {
          'name': 'yscale',
          'range': 'height',
          'domain': {'data': 'table', 'field': 'frequency'},
          'nice': true,
        },
      ],

      'axes': [
        {
          'orient': 'bottom',
          'scale': 'xscale',
          'bandPosition': 0.5,
          'title': this.hsLanguageService.getTranslation(
            'STATISTICS.INTERVALS'
          ),
          'labelAngle': 15,
          'labelBaseline': 'line-top',
          'titleY': 40,
        },
        {
          'orient': 'left',
          'scale': 'yscale',
          'title': this.hsLanguageService.getTranslation(
            'STATISTICS.FREQUENCY'
          ),
          'tickMinStep': 1,
        },
      ],

      'marks': [
        {
          'type': 'rect',
          'from': {'data': 'table'},
          'encode': {
            'enter': {
              'x': {'scale': 'xscale', 'field': 'interval'},
              'width': {'scale': 'xscale', 'band': 1},
              'y': {'scale': 'yscale', 'field': 'frequency'},
              'y2': {'scale': 'yscale', 'value': 0},
            },
            'update': {
              'fill': {'value': 'steelblue'},
              'fillOpacity': {'value': 0.4},
            },
            'hover': {'fill': {'value': 'red'}},
          },
        },
        {
          'type': 'line',
          'from': {'data': 'table'},
          'encode': {
            'enter': {
              'interpolate': {'value': 'monotone'},
              'x': {'scale': 'xscale', 'field': 'interval', 'offset': 30},
              'y': {'scale': 'yscale', 'field': 'frequency'},
              'stroke': {'value': 'goldenrod'},
              'strokeWidth': {'value': 2},
            },
          },
        },
        {
          'type': 'text',
          'encode': {
            'enter': {
              'align': {'value': 'center'},
              'baseline': {'value': 'top'},
{'fraction_non_alphanumeric': 0.16244396803741962, 'fraction_numerical': 0.006723835509647242, 'mean_word_length': 2.0052708638360177, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1117716', 'n_tokens_mistral': 3198, 'n_tokens_neox': 3086, 'n_words': 599}