Функция закрытия для каждого экземпляра класса (JavaScript) - PullRequest
0 голосов
/ 15 мая 2018

Мне нужен класс JavaScript с именем GKChart: -

class GKChart {   
  constructor(data) {
    try {
      console.info("Enter: Chart Designing initialize function");
      this.chartID = data.id;
      this.chartData = data.data;
      this.chartCall = new chartCalling();
      this.load = this.initialize(this.chartData.config.chartType, this.chartData, this.chartID, this.chartCall);
      this.load();
      this.resize(this.load);
      console.info("Exit: Chart Designing initialize function");
    } catch (err) {
      console.log("Error Found in GKChart Constructoru", err);
    }   
  }
  initialize(chartTypeLoad, chartDataLoad, chartIDLoad, chartCallLoad) {
    try {
      console.log("Start : initialize");
      let chartType = chartTypeLoad;
      let chartData = chartDataLoad;
      let chartID = chartIDLoad;
      var chartCall = chartCallLoad;
      /*Define chart css properties*/
      var loadIt = function() {
        console.warn("Resize Load : "+chartID);
        css(document.querySelector("#" + chartID), {
          'display': 'block'
        });

        switch (chartType) {
          case "line":
            {
              chartCall.lineChart(chartData, chartID);
              break;
            }
          case 'bar':
            {
              chartCall.barChart(chartData, chartID);
              break;
            }
          default:
            {
              console.log("Invalid choice of chart");
              break;
            }
        }
      }

      return loadIt;
      console.log("End : initialize");
    } catch (err) {
      console.error("Exception occurred in Home module:  " + err.message);
    }
  }

  resize(loadFun) {
    try {
        window.addEventListener("resize", function (e) {
          window.resizeEvt;
          window.addEventListener("resize", function () {
            clearTimeout(window.resizeEvt);
            window.resizeEvt = setTimeout(function () {
              loadFun();
              console.warn("ResizeCalled");
            }, 250);
          });
        });
    } catch (err) {
      console.log("error occured while resizing the chart");
    }
  }
}

И я хочу вызвать этот класс для более чем 20 экземпляров с некоторыми данными купола

new GKChart({id: "stepChartComparision", data: stepChartComparision});
new GKChart({id: "stepChartFill", data: stepChartFill});
new GKChart({id: "stepChartComparisionFill", data: stepChartComparisionFill});
...
...
...

Итак, для всех этих звонков я рисую несколько холстовых диаграмм. Чтобы сделать эти графики холстом отзывчивыми, я должен нарисовать каждый график для изменения размера. Поэтому я попытался создать функцию закрытия, чтобы сохранить копию функции «this.load», но, как я вижу, ее последний вызов вызывается только один раз для последнего экземпляра.

Пожалуйста, помогите мне получить его для каждого вызова, или, другими словами, я хочу изменить размер каждой таблицы холста.

Спасибо.

1 Ответ

0 голосов
/ 17 мая 2018

Мое закрытие работает должным образом, но из-за вызова ASYNC функции setTimeout выполняется только последний вызов, но когда я удалил его и попытался запустить, он работает правильно.

Код ответа: -

resize(loadFun) {
    try {
        window.addEventListener("resize", function (e) {
          window.resizeEvt;
          window.addEventListener("resize", function () {
            loadFun();
          });
        });
    } catch (err) {
      console.log("error occured while resizing the chart");
    }
  }
...