{"version":3,"sources":["https://lively-kernel.org/lively4/BP2019RH-stable/src/internal/individuals-as-points/common/distribution-bar-chart.js"],"names":["Chart","DistributionBarChart","constructor","individuals","key","canvasWidth","canvasHeight","dataProcessor","undefined","colorStore","canvas","_generateBarChartCanvas","ctx","getContext","labels","distributionData","barBackgroundColors","setDataProcessor","setColorStore","generateCanvas","_generateBarChart","_generateLabels","_generateDistributionData","_generateBarBackgroundColors","_generateChart","getValuesForAttribute","forEach","label","individual","getUniqueValueFromIndividual","Object","keys","map","getColorForValue","backgroundColor","convertColorObjectToRGBAHexString","myChart","type","data","datasets","options","title","display","text","responsive","scales","xAxes","ticks","maxRotation","minRotation","yAxes","beginAtZero","width","height"],"mappings":"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","file":"distribution-bar-chart.js","sourcesContent":["import Chart from \"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.js\"\n\nexport default class DistributionBarChart {\n constructor(individuals, key, canvasWidth, canvasHeight) {\n this.dataProcessor = undefined\n this.colorStore = undefined\n \n this.individuals = individuals\n this.key = key\n this.canvasWidth = canvasWidth\n this.canvasHeight = canvasHeight\n \n this.canvas = this._generateBarChartCanvas()\n this.ctx = this.canvas.getContext('2d')\n \n this.labels = []\n this.distributionData = {}\n this.barBackgroundColors = []\n }\n \n // ------------------------------------------\n // Public Methods\n // ------------------------------------------\n \n setDataProcessor(dataProcessor) {\n this.dataProcessor = dataProcessor\n }\n \n setColorStore(colorStore) {\n this.colorStore = colorStore\n }\n \n generateCanvas() {\n this._generateBarChart()\n return this.canvas\n }\n \n // ------------------------------------------\n // Private Methods\n // ------------------------------------------\n \n _generateBarChart() {\n this._generateLabels()\n this._generateDistributionData()\n this._generateBarBackgroundColors()\n this._generateChart()\n \n }\n \n _generateLabels() {\n this.labels = this.dataProcessor.getValuesForAttribute(this.key)\n this.labels.forEach( label => this.distributionData[label] = 0)\n }\n \n _generateDistributionData() {\n this.individuals.forEach( individual => {\n let label = this.dataProcessor.getUniqueValueFromIndividual(individual, this.key)\n this.distributionData[label] += 1\n })\n this.distributionData = Object.keys(this.distributionData).map( key => this.distributionData[key])\n }\n \n _generateBarBackgroundColors() {\n this.barBackgroundColors = this.labels.map(label => this.colorStore.getColorForValue(this.key, label))\n this.barBackgroundColors = this.barBackgroundColors.map( backgroundColor => this.colorStore.convertColorObjectToRGBAHexString(backgroundColor))\n }\n \n _generateChart() {\n let labels = this.labels\n let barBackgroundColors = this.barBackgroundColors\n let distributionData = this.distributionData\n let myChart = new Chart(this.ctx, {\n type: 'bar',\n data: {\n labels: labels,\n datasets: [{\n label: '# of individuals',\n data: distributionData,\n backgroundColor: barBackgroundColors,\n }]\n },\n options: {\n title: {\n display: true,\n text: this.key\n },\n responsive: false,\n scales: {\n xAxes: [{\n ticks: {\n maxRotation: 90,\n minRotation: 80\n }\n }],\n yAxes: [{\n ticks: {\n beginAtZero: true\n }\n }]\n }\n }\n });\n }\n \n _generateBarChartCanvas() {\n let canvas = ;\n canvas.width = this.canvasWidth\n canvas.height = this.canvasHeight\n return canvas\n }\n}"]}