constructor(opts) {
    super(opts);

    // load in arguments from config object
    this.margin = opts.margin || { top: 50, right: 20, bottom: 50, left: 100 };
    this.roughness = roughCeiling({
      roughness: opts.roughness,
      defaultValue: 2.2,
    });
    this.axisStrokeWidth = opts.axisStrokeWidth || 0.5;
    this.axisRoughness = opts.axisRoughness || 0.5;
    this.stroke = opts.stroke || "black";
    this.fillWeight = opts.fillWeight || 0.5;
    this.colors = opts.colors;
    this.strokeWidth = opts.strokeWidth || 1;
    this.axisFontSize = opts.axisFontSize;
    this.x = opts.x;
    this.y = this.dataFormat === "object" ? "y" : opts.y;
    this.xValueFormat = opts.xValueFormat;
    this.yValueFormat = opts.yValueFormat;
    this.legend = opts.legend !== false;
    this.legendPosition = opts.legendPosition || "right";
    this.circle = opts.circle !== false;
    this.circleRadius = opts.circleRadius || 10;
    this.circleRoughness = roughCeiling({
      roughness: opts.circleRoughness,
      defaultValue: 2,
    });
    this.xLabel = opts.xLabel || "";
    this.yLabel = opts.yLabel || "";
    this.labelFontSize = opts.labelFontSize || "1rem";
    if (this.dataFormat === "file") {
      this.dataSources = [];
      this.yKeys = Object.keys(opts).filter((name) => /y/.test(name));
      this.yKeys.map((key, i) => {
        if (key !== "yLabel") this.dataSources.push(opts[key]);
      });
    }
    this.responsive = true;
    this.boundRedraw = this.redraw.bind(this, opts);
    // new width
    this.initChartValues(opts);
    // resolve font
    this.resolveFont();
    // create the chart
    this.drawChart = this.resolveData(opts.data);
    this.drawChart();
    if (opts.title !== "undefined") this.setTitle(opts.title);
    window.addEventListener("resize", this.resizeHandler.bind(this));
  }
Constructs a new Line instance.
@param {Object} opts - Configuration object for the line chart.