remove stacked-bar service

src/app/services/vis/stacked-bar.service.ts

-import { Injectable } from '@angular/core';
-import * as d3 from 'd3';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class StackedBarService {
-  constructor() {}
-
-  createChart(element: any, height: number, width: number, stackedData: any, indicators: any) {
-    const margin = { top: 10, right: 10, bottom: 40, left: 10 };
-    const rawData = stackedData.getAllSingleFeedbacks();
-    const series = d3
-      .stack()
-      .keys(indicators)(rawData)
-      .map((d) => (d.forEach((v) => (v.key = d.key)), d));
-    const y = d3
-      .scaleLinear()
-      .domain([0, d3.max(series, (d) => d3.max(d, (d) => d[1]))])
-      .rangeRound([height - margin.bottom, margin.top]);
-    const x = d3
-      .scaleBand()
-      .domain(rawData.map((d) => d.name))
-      .range([margin.left, width - margin.right])
-      .padding(0.1);
-    const xDomain = d3
-      .scaleBand()
-      .domain(rawData.map((d) => d.title))
-      .range([margin.left, width - margin.right])
-      .padding(0.1);
-    const xAxis = (g) =>
-      g
-        .attr('transform', `translate(0,${height - margin.bottom})`)
-        .call(
-          d3
-            .axisBottom(x)
-            .tickSizeOuter(0)
-            .tickFormat((d) => this.getStatus(d, stackedData))
-        )
-        .call((g) => g.selectAll('.domain').remove());
-    const xDomainAxis = (g) =>
-      g
-        .attr('transform', `translate(0,${height - margin.bottom / 2})`)
-        .call(d3.axisBottom(xDomain).tickSize(0).tickSizeOuter(0))
-        .call((g) => g.selectAll('.domain').remove());
-
-    const color = d3
-      .scaleOrdinal()
-      .domain(series.map((d) => d.key))
-      .range(d3.schemeBlues[d3.max([3, series.length])])
-      .unknown('#ccc');
-
-    const svg = d3
-      .select(element)
-      .append('svg')
-      .attr('viewBox', [0, 0, width, height])
-      .attr('width', width)
-      .attr('height', height);
-
-    svg
-      .append('g')
-      .selectAll('g')
-      .data(series)
-      .join('g')
-      .attr('fill', (d) => color(d.key))
-      .selectAll('rect')
-      .data((d) => d)
-      .join('rect')
-      .attr('x', (d, i) => x(d.data.name))
-      .attr('y', (d) => y(d[1]))
-      .attr('height', (d) => y(d[0]) - y(d[1]))
-      .attr('width', x.bandwidth())
-      .append('title')
-      .text(
-        (d) => `${d.data.name} ${d.key}
-        ${d.data[d.key]}`
-      );
-
-    svg.append('g').call(xAxis);
-    svg.append('g').call(xDomainAxis);
-    svg.selectAll('.tick text').call(this.wrap, xDomain.bandwidth());
-  }
-
-  // copied from https://observablehq.com/@dagonar/text-wrap-axis
-  wrap(text, wrapWidth, yAxisAdjustment = 0) {
-    text.each(function () {
-      const text = d3.select(this);
-      const words = text.text().split(/\s+/).reverse();
-      let word;
-      let line = [];
-      let lineNumber = 0;
-      const lineHeight = 1.1; // ems
-      const y = text.attr('y');
-      const dy = parseFloat(text.attr('dy')) - yAxisAdjustment;
-      let tspan = text.text(null).append('tspan').attr('x', 0).attr('y', y).attr('dy', `${dy}em`);
-      while ((word = words.pop())) {
-        line.push(word);
-        tspan.text(line.join(' '));
-        if (tspan.node().getComputedTextLength() > wrapWidth) {
-          line.pop();
-          tspan.text(line.join(' '));
-          line = [word];
-          tspan = text
-            .append('tspan')
-            .attr('x', 0)
-            .attr('y', y)
-            .attr('dy', ++lineNumber * lineHeight + dy + 'em')
-            .text(word);
-        }
-      }
-    });
-    return 0;
-  }
-
-  private getStatus(name: string, data: any) {
-    const foundDO: any = data.getSingleFeedbackByName(name);
-    return foundDO.status;
-  }
-}