var colors = ["#fa6767"],
  dataColors = $("#basic-area").data("colors"),
  options = {
    chart: { height: 380, type: "area", zoom: { enabled: !1 } },
    dataLabels: { enabled: !1 },
    stroke: { width: 3, curve: "straight" },
    colors: (colors = dataColors ? dataColors.split(",") : colors),
    series: [{ name: "STOCK ABC", data: series.monthDataSeries1.prices }],
    title: { text: "Fundamental Analysis of Stocks", align: "left" },
    subtitle: { text: "Price Movements", align: "left" },
    labels: series.monthDataSeries1.dates,
    xaxis: { type: "datetime" },
    yaxis: { opposite: !0 },
    legend: { horizontalAlign: "left" },
    grid: { borderColor: "#f1f3fa" },
    responsive: [
      {
        breakpoint: 600,
        options: { chart: { toolbar: { show: !1 } }, legend: { show: !1 } },
      },
    ],
  },
  chart = new ApexCharts(document.querySelector("#basic-area"), options),
  colors = (chart.render(), ["#727cf5", "#6c757d"]),
  dataColors = $("#spline-area").data("colors"),
  options = {
    chart: { height: 380, type: "area" },
    dataLabels: { enabled: !1 },
    stroke: { width: 3, curve: "smooth" },
    colors: (colors = dataColors ? dataColors.split(",") : colors),
    series: [
      { name: "Series 1", data: [31, 40, 28, 51, 42, 109, 100] },
      { name: "Series 2", data: [11, 32, 45, 32, 34, 52, 41] },
    ],
    legend: { offsetY: 5 },
    xaxis: { categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul"] },
    tooltip: { fixed: { enabled: !1, position: "topRight" } },
    grid: { borderColor: "#f1f3fa" },
  },
  colors =
    ((chart = new ApexCharts(
      document.querySelector("#spline-area"),
      options
    )).render(),
    $(document).ready(function () {
      function t(e) {
        var t = document.querySelectorAll("button");
        Array.prototype.forEach.call(t, function (e) {
          e.classList.remove("active");
        }),
          e.target.classList.add("active");
      }
      var e = ["#6c757d"],
        a = $("#area-chart-datetime").data("colors"),
        a =
          (a && (e = a.split(",")),
          {
            annotations: {
              yaxis: [
                {
                  y: 30,
                  borderColor: "#999",
                  label: {
                    show: !0,
                    text: "Support",
                    style: { color: "#fff", background: "#00E396" },
                  },
                },
              ],
              xaxis: [
                {
                  x: new Date("14 Nov 2012").getTime(),
                  borderColor: "#999",
                  yAxisIndex: 0,
                  label: {
                    show: !0,
                    text: "Rally",
                    style: { color: "#fff", background: "#775DD0" },
                  },
                },
              ],
            },
            chart: { type: "area", height: 350 },
            stroke: { width: 3, curve: "smooth" },
            colors: e,
            dataLabels: { enabled: !1 },
            series: [
              {
                data: [
                  [13273596e5, 30.95],
                  [1327446e6, 31.34],
                  [13275324e5, 31.18],
                  [13276188e5, 31.05],
                  [1327878e6, 31],
                  [13279644e5, 30.95],
                  [13280508e5, 31.24],
                  [13281372e5, 31.29],
                  [13282236e5, 31.85],
                  [13284828e5, 31.86],
                  [13285692e5, 32.28],
                  [13286556e5, 32.1],
                  [1328742e6, 32.65],
                  [13288284e5, 32.21],
                  [13290876e5, 32.35],
                  [1329174e6, 32.44],
                  [13292604e5, 32.46],
                  [13293468e5, 32.86],
                  [13294332e5, 32.75],
                  [13297788e5, 32.54],
                  [13298652e5, 32.33],
                  [13299516e5, 32.97],
                  [1330038e6, 33.41],
                  [13302972e5, 33.27],
                  [13303836e5, 33.27],
                  [133047e7, 32.89],
                  [13305564e5, 33.1],
                  [13306428e5, 33.73],
                  [1330902e6, 33.22],
                  [13309884e5, 31.99],
                  [13310748e5, 32.41],
                  [13311612e5, 33.05],
                  [13312476e5, 33.64],
                  [13315068e5, 33.56],
                  [13315932e5, 34.22],
                  [13316796e5, 33.77],
                  [1331766e6, 34.17],
                  [13318524e5, 33.82],
                  [13321116e5, 34.51],
                  [1332198e6, 33.16],
                  [13322844e5, 33.56],
                  [13323708e5, 33.71],
                  [13324572e5, 33.81],
                  [13327128e5, 34.4],
                  [13327992e5, 34.63],
                  [13328856e5, 34.46],
                  [1332972e6, 34.48],
                  [13330584e5, 34.31],
                  [13333176e5, 34.7],
                  [1333404e6, 34.31],
                  [13334904e5, 33.46],
                  [13335768e5, 33.59],
                  [13339224e5, 33.22],
                  [13340088e5, 32.61],
                  [13340952e5, 33.01],
                  [13341816e5, 33.55],
                  [1334268e6, 33.18],
                  [13345272e5, 32.84],
                  [13346136e5, 33.84],
                  [13347e8, 33.39],
                  [13347864e5, 32.91],
                  [13348728e5, 33.06],
                  [1335132e6, 32.62],
                  [13352184e5, 32.4],
                  [13353048e5, 33.13],
                  [13353912e5, 33.26],
                  [13354776e5, 33.58],
                  [13357368e5, 33.55],
                  [13358232e5, 33.77],
                  [13359096e5, 33.76],
                  [1335996e6, 33.32],
                  [13360824e5, 32.61],
                  [13363416e5, 32.52],
                  [1336428e6, 32.67],
                  [13365144e5, 32.52],
                  [13366008e5, 31.92],
                  [13366872e5, 32.2],
                  [13369464e5, 32.23],
                  [13370328e5, 32.33],
                  [13371192e5, 32.36],
                  [13372056e5, 32.01],
                  [1337292e6, 31.31],
                  [13375512e5, 32.01],
                  [13376376e5, 32.01],
                  [1337724e6, 32.18],
                  [13378104e5, 31.54],
                  [13378968e5, 31.6],
                  [13382424e5, 32.05],
                  [13383288e5, 31.29],
                  [13384152e5, 31.05],
                  [13385016e5, 29.82],
                  [13387608e5, 30.31],
                  [13388472e5, 30.7],
                  [13389336e5, 31.69],
                  [133902e7, 31.32],
                  [13391064e5, 31.65],
                  [13393656e5, 31.13],
                  [1339452e6, 31.77],
                  [13395384e5, 31.79],
                  [13396248e5, 31.67],
                  [13397112e5, 32.39],
                  [13399704e5, 32.63],
                  [13400568e5, 32.89],
                  [13401432e5, 31.99],
                  [13402296e5, 31.23],
                  [1340316e6, 31.57],
                  [13405752e5, 30.84],
                  [13406616e5, 31.07],
                  [1340748e6, 31.41],
                  [13408344e5, 31.17],
                  [13409208e5, 32.37],
                  [134118e7, 32.19],
                  [13412664e5, 32.51],
                  [13414392e5, 32.53],
                  [13415256e5, 31.37],
                  [13417848e5, 30.43],
                  [13418712e5, 30.44],
                  [13419576e5, 30.2],
                  [1342044e6, 30.14],
                  [13421304e5, 30.65],
                  [13423896e5, 30.4],
                  [1342476e6, 30.65],
                  [13425624e5, 31.43],
                  [13426488e5, 31.89],
                  [13427352e5, 31.38],
                  [13429944e5, 30.64],
                  [13430808e5, 30.02],
                  [13431672e5, 30.33],
                  [13432536e5, 30.95],
                  [134334e7, 31.89],
                  [13435992e5, 31.01],
                  [13436856e5, 30.88],
                  [1343772e6, 30.69],
                  [13438584e5, 30.58],
                  [13439448e5, 32.02],
                  [1344204e6, 32.14],
                  [13442904e5, 32.37],
                  [13443768e5, 32.51],
                  [13444632e5, 32.65],
                  [13445496e5, 32.64],
                  [13448088e5, 32.27],
                  [13448952e5, 32.1],
                  [13449816e5, 32.91],
                  [1345068e6, 33.65],
                  [13451544e5, 33.8],
                  [13454136e5, 33.92],
                  [13455e8, 33.75],
                  [13455864e5, 33.84],
                  [13456728e5, 33.5],
                  [13457592e5, 32.26],
                  [13460184e5, 32.32],
                  [13461048e5, 32.06],
                  [13461912e5, 31.96],
                  [13462776e5, 31.46],
                  [1346364e6, 31.27],
                  [13467096e5, 31.43],
                  [1346796e6, 32.26],
                  [13468824e5, 32.79],
                  [13469688e5, 32.46],
                  [1347228e6, 32.13],
                  [13473144e5, 32.43],
                  [13474008e5, 32.42],
                  [13474872e5, 32.81],
                  [13475736e5, 33.34],
                  [13478328e5, 33.41],
                  [13479192e5, 32.57],
                  [13480056e5, 33.12],
                  [1348092e6, 34.53],
                  [13481784e5, 33.83],
                  [13484376e5, 33.41],
                  [1348524e6, 32.9],
                  [13486104e5, 32.53],
                  [13486968e5, 32.8],
                  [13487832e5, 32.44],
                  [13490424e5, 32.62],
                  [13491288e5, 32.57],
                  [13492152e5, 32.6],
                  [13493016e5, 32.68],
                  [1349388e6, 32.47],
                  [13496472e5, 32.23],
                  [13497336e5, 31.68],
                  [134982e7, 31.51],
                  [13499064e5, 31.78],
                  [13499928e5, 31.94],
                  [1350252e6, 32.33],
                  [13503384e5, 33.24],
                  [13504248e5, 33.44],
                  [13505112e5, 33.48],
                  [13505976e5, 33.24],
                  [13508568e5, 33.49],
                  [13509432e5, 33.31],
                  [13510296e5, 33.36],
                  [1351116e6, 33.4],
                  [13512024e5, 34.01],
                  [1351638e6, 34.02],
                  [13517244e5, 34.36],
                  [13518108e5, 34.39],
                  [135207e7, 34.24],
                  [13521564e5, 34.39],
                  [13522428e5, 33.47],
                  [13523292e5, 32.98],
                  [13524156e5, 32.9],
                  [13526748e5, 32.7],
                  [13527612e5, 32.54],
                  [13528476e5, 32.23],
                  [1352934e6, 32.64],
                  [13530204e5, 32.65],
                  [13532796e5, 32.92],
                  [1353366e6, 32.64],
                  [13534524e5, 32.84],
                  [13536252e5, 33.4],
                  [13538844e5, 33.3],
                  [13539708e5, 33.18],
                  [13540572e5, 33.88],
                  [13541436e5, 34.09],
                  [135423e7, 34.61],
                  [13544892e5, 34.7],
                  [13545756e5, 35.3],
                  [1354662e6, 35.4],
                  [13547484e5, 35.14],
                  [13548348e5, 35.48],
                  [1355094e6, 35.75],
                  [13551804e5, 35.54],
                  [13552668e5, 35.96],
                  [13553532e5, 35.53],
                  [13554396e5, 37.56],
                  [13556988e5, 37.42],
                  [13557852e5, 37.49],
                  [13558716e5, 38.09],
                  [1355958e6, 37.87],
                  [13560444e5, 37.71],
                  [13563036e5, 37.53],
                  [13564764e5, 37.55],
                  [13565628e5, 37.3],
                  [13566492e5, 36.9],
                  [13569084e5, 37.68],
                  [13570812e5, 38.34],
                  [13571676e5, 37.75],
                  [1357254e6, 38.13],
                  [13575132e5, 37.94],
                  [13575996e5, 38.14],
                  [1357686e6, 38.66],
                  [13577724e5, 38.62],
                  [13578588e5, 38.09],
                  [1358118e6, 38.16],
                  [13582044e5, 38.15],
                  [13582908e5, 37.88],
                  [13583772e5, 37.73],
                  [13584636e5, 37.98],
                  [13588092e5, 37.95],
                  [13588956e5, 38.25],
                  [1358982e6, 38.1],
                  [13590684e5, 38.32],
                  [13593276e5, 38.24],
                  [1359414e6, 38.52],
                  [13595004e5, 37.94],
                  [13595868e5, 37.83],
                  [13596732e5, 38.34],
                  [13599324e5, 38.1],
                  [13600188e5, 38.51],
                  [13601052e5, 38.4],
                  [13601916e5, 38.07],
                  [1360278e6, 39.12],
                  [13605372e5, 38.64],
                  [13606236e5, 38.89],
                  [136071e7, 38.81],
                  [13607964e5, 38.61],
                  [13608828e5, 38.63],
                  [13612284e5, 38.99],
                  [13613148e5, 38.77],
                  [13614012e5, 38.34],
                  [13614876e5, 38.55],
                  [13617468e5, 38.11],
                  [13618332e5, 38.59],
                  [13619196e5, 39.6],
                ],
              },
            ],
            markers: { size: 0, style: "hollow" },
            xaxis: {
              type: "datetime",
              min: new Date("01 Mar 2012").getTime(),
              tickAmount: 6,
            },
            tooltip: { x: { format: "dd MMM yyyy" } },
            fill: {
              type: "gradient",
              gradient: {
                shadeIntensity: 1,
                opacityFrom: 0.7,
                opacityTo: 0.9,
                stops: [0, 100],
              },
            },
          }),
        o = new ApexCharts(document.querySelector("#area-chart-datetime"), a);
      o.render();
      document
        .querySelector("#one_month")
        .addEventListener("click", function (e) {
          t(e),
            o.updateOptions({
              xaxis: {
                min: new Date("28 Jan 2013").getTime(),
                max: new Date("27 Feb 2013").getTime(),
              },
            });
        }),
        document
          .querySelector("#six_months")
          .addEventListener("click", function (e) {
            t(e),
              o.updateOptions({
                xaxis: {
                  min: new Date("27 Sep 2012").getTime(),
                  max: new Date("27 Feb 2013").getTime(),
                },
              });
          }),
        document
          .querySelector("#one_year")
          .addEventListener("click", function (e) {
            t(e),
              o.updateOptions({
                xaxis: {
                  min: new Date("27 Feb 2012").getTime(),
                  max: new Date("27 Feb 2013").getTime(),
                },
              });
          }),
        document.querySelector("#ytd").addEventListener("click", function (e) {
          t(e),
            o.updateOptions({
              xaxis: {
                min: new Date("01 Jan 2013").getTime(),
                max: new Date("27 Feb 2013").getTime(),
              },
            });
        }),
        document.querySelector("#all").addEventListener("click", function (e) {
          t(e), o.updateOptions({ xaxis: { min: void 0, max: void 0 } });
        }),
        document
          .querySelector("#ytd")
          .addEventListener("click", function () {});
    }),
    ["#0acf97", "#ffbc00"]),
  dataColors = $("#area-chart-negative").data("colors"),
  options = {
    chart: { height: 380, type: "area" },
    dataLabels: { enabled: !1 },
    stroke: { width: 2, curve: "straight" },
    colors: (colors = dataColors ? dataColors.split(",") : colors),
    series: [
      {
        name: "North",
        data: [
          { x: 1996, y: 322 },
          { x: 1997, y: 324 },
          { x: 1998, y: 329 },
          { x: 1999, y: 342 },
          { x: 2e3, y: 348 },
          { x: 2001, y: 334 },
          { x: 2002, y: 325 },
          { x: 2003, y: 316 },
          { x: 2004, y: 318 },
          { x: 2005, y: 330 },
          { x: 2006, y: 355 },
          { x: 2007, y: 366 },
          { x: 2008, y: 337 },
          { x: 2009, y: 352 },
          { x: 2010, y: 377 },
          { x: 2011, y: 383 },
          { x: 2012, y: 344 },
          { x: 2013, y: 366 },
          { x: 2014, y: 389 },
          { x: 2015, y: 334 },
        ],
      },
      {
        name: "South",
        data: [
          { x: 1996, y: 162 },
          { x: 1997, y: 90 },
          { x: 1998, y: 50 },
          { x: 1999, y: 77 },
          { x: 2e3, y: 35 },
          { x: 2001, y: -45 },
          { x: 2002, y: -88 },
          { x: 2003, y: -120 },
          { x: 2004, y: -156 },
          { x: 2005, y: -123 },
          { x: 2006, y: -88 },
          { x: 2007, y: -66 },
          { x: 2008, y: -45 },
          { x: 2009, y: -29 },
          { x: 2010, y: -45 },
          { x: 2011, y: -88 },
          { x: 2012, y: -132 },
          { x: 2013, y: -146 },
          { x: 2014, y: -169 },
          { x: 2015, y: -184 },
        ],
      },
    ],
    xaxis: {
      type: "datetime",
      axisBorder: { show: !1 },
      axisTicks: { show: !1 },
    },
    yaxis: {
      tickAmount: 4,
      floating: !1,
      labels: { style: { color: "#8e8da4" }, offsetY: -7, offsetX: 0 },
      axisBorder: { show: !1 },
      axisTicks: { show: !1 },
    },
    fill: { opacity: 0.5, gradient: { enabled: !1 } },
    tooltip: {
      x: { format: "yyyy" },
      fixed: { enabled: !1, position: "topRight" },
    },
    legend: { offsetY: 5 },
    grid: {
      yaxis: { lines: { offsetX: -30 } },
      padding: { left: 0, bottom: 10 },
      borderColor: "#f1f3fa",
    },
  },
  colors =
    ((chart = new ApexCharts(
      document.querySelector("#area-chart-negative"),
      options
    )).render(),
    ["#FF7F00"]),
  dataColors = $("#area-chart-github2").data("colors"),
  optionsarea2 = {
    chart: {
      id: "chartyear",
      type: "area",
      height: 200,
      toolbar: { show: !1, autoSelected: "pan" },
    },
    colors: (colors = dataColors ? dataColors.split(",") : colors),
    stroke: { width: 0, curve: "smooth" },
    dataLabels: { enabled: !1 },
    fill: { opacity: 1, type: "solid" },
    series: [{ name: "commits", data: githubdata.series }],
    yaxis: { tickAmount: 10, labels: { show: !1 } },
    xaxis: { type: "datetime" },
  },
  chartarea2 = new ApexCharts(
    document.querySelector("#area-chart-github2"),
    optionsarea2
  ),
  colors = (chartarea2.render(), ["#7BD39A"]),
  options =
    ((dataColors = $("#area-chart-github").data("colors")) &&
      (colors = dataColors.split(",")),
    {
      chart: {
        height: 175,
        type: "area",
        toolbar: { autoSelected: "selection" },
        brush: { enabled: !0, target: "chartyear" },
        selection: {
          enabled: !0,
          xaxis: {
            min: new Date("05 Jan 2014").getTime(),
            max: new Date("04 Jan 2015").getTime(),
          },
        },
      },
      colors: colors,
      dataLabels: { enabled: !1 },
      stroke: { width: 0, curve: "smooth" },
      series: [{ name: "commits", data: githubdata.series }],
      fill: { opacity: 1, type: "solid" },
      legend: { position: "top", horizontalAlign: "left" },
      xaxis: { type: "datetime" },
    }),
  colors =
    ((chart = new ApexCharts(
      document.querySelector("#area-chart-github"),
      options
    )).render(),
    ["#727cf5", "#0acf97", "#e3eaef"]),
  options =
    ((dataColors = $("#stacked-area").data("colors")) &&
      (colors = dataColors.split(",")),
    {
      series: [
        {
          name: "South",
          data: generateDayWiseTimeSeries(
            new Date("11 Feb 2017 GMT").getTime(),
            20,
            { min: 10, max: 60 }
          ),
        },
        {
          name: "North",
          data: generateDayWiseTimeSeries(
            new Date("11 Feb 2017 GMT").getTime(),
            20,
            { min: 10, max: 20 }
          ),
        },
        {
          name: "Central",
          data: generateDayWiseTimeSeries(
            new Date("11 Feb 2017 GMT").getTime(),
            20,
            { min: 10, max: 15 }
          ),
        },
      ],
      chart: {
        type: "area",
        height: 350,
        stacked: !0,
        events: {
          selection: function (e, t) {
            console.log(new Date(t.xaxis.min));
          },
        },
      },
      colors: ["#008FFB", "#00E396", "#CED4DC"],
      dataLabels: { enabled: !1 },
      stroke: { curve: "monotoneCubic" },
      fill: {
        type: "gradient",
        gradient: { opacityFrom: 0.6, opacityTo: 0.8 },
      },
      legend: { position: "top", horizontalAlign: "left" },
      xaxis: { type: "datetime" },
    });
function generateDayWiseTimeSeries(e, t, a) {
  for (var o = 0, r = []; o < t; ) {
    var i = e,
      s = Math.floor(Math.random() * (a.max - a.min + 1)) + a.min;
    r.push([i, s]), (e += 864e5), o++;
  }
  return r;
}
(chart = new ApexCharts(
  document.querySelector("#stacked-area"),
  options
)).render();
for (
  var ts1 = 13885344e5,
    ts2 = 13886208e5,
    ts3 = 13890528e5,
    dataSet = [[], [], []],
    i = 0;
  i < 12;
  i++
) {
  var innerArr = [(ts1 += 864e5), dataSeries[2][i].value];
  dataSet[0].push(innerArr);
}
for (i = 0; i < 18; i++) {
  innerArr = [(ts2 += 864e5), dataSeries[1][i].value];
  dataSet[1].push(innerArr);
}
for (i = 0; i < 12; i++) {
  innerArr = [(ts3 += 864e5), dataSeries[0][i].value];
  dataSet[2].push(innerArr);
}
(colors = ["#39afd1", "#fa5c7c", "#727cf5"]),
  (dataColors = $("#area-timeSeries").data("colors")) &&
    (colors = dataColors.split(",")),
  (options = {
    series: [
      { name: "PRODUCT A", data: dataSet[0] },
      { name: "PRODUCT B", data: dataSet[1] },
      { name: "PRODUCT C", data: dataSet[2] },
    ],
    chart: { type: "area", stacked: !1, height: 350, zoom: { enabled: !1 } },
    dataLabels: { enabled: !1 },
    markers: { size: 0 },
    colors: colors,
    fill: {
      gradient: {
        enabled: !0,
        shadeIntensity: 1,
        inverseColors: !1,
        opacityFrom: 0.45,
        opacityTo: 0.05,
        stops: [20, 100, 100, 100],
      },
    },
    yaxis: {
      labels: {
        style: { color: "#8e8da4" },
        offsetX: 0,
        formatter: function (e) {
          return (e / 1e6).toFixed(0);
        },
      },
      axisBorder: { show: !1 },
      axisTicks: { show: !1 },
    },
    xaxis: {
      type: "datetime",
      tickAmount: 8,
      labels: {
        formatter: function (e) {
          return moment(new Date(e)).format("DD MMM YYYY");
        },
      },
    },
    title: {
      text: "Irregular Data in Time Series",
      align: "left",
      offsetX: 14,
    },
    tooltip: { shared: !0 },
    legend: { position: "top", horizontalAlign: "right", offsetX: -10 },
  }),
  (chart = new ApexCharts(
    document.querySelector("#area-timeSeries"),
    options
  )).render(),
  (colors = ["#6c757d"]),
  (dataColors = $("#area-chart-nullvalues").data("colors")),
  (options = {
    series: [
      {
        name: "Network",
        data: [
          { x: "Dec 23 2017", y: null },
          { x: "Dec 24 2017", y: 44 },
          { x: "Dec 25 2017", y: 31 },
          { x: "Dec 26 2017", y: 38 },
          { x: "Dec 27 2017", y: null },
          { x: "Dec 28 2017", y: 32 },
          { x: "Dec 29 2017", y: 55 },
          { x: "Dec 30 2017", y: 51 },
          { x: "Dec 31 2017", y: 67 },
          { x: "Jan 01 2018", y: 22 },
          { x: "Jan 02 2018", y: 34 },
          { x: "Jan 03 2018", y: null },
          { x: "Jan 04 2018", y: null },
          { x: "Jan 05 2018", y: 11 },
          { x: "Jan 06 2018", y: 4 },
          { x: "Jan 07 2018", y: 15 },
          { x: "Jan 08 2018", y: null },
          { x: "Jan 09 2018", y: 9 },
          { x: "Jan 10 2018", y: 34 },
          { x: "Jan 11 2018", y: null },
          { x: "Jan 12 2018", y: null },
          { x: "Jan 13 2018", y: 13 },
          { x: "Jan 14 2018", y: null },
        ],
      },
    ],
    chart: {
      type: "area",
      height: 350,
      animations: { enabled: !1 },
      zoom: { enabled: !1 },
    },
    dataLabels: { enabled: !1 },
    stroke: { curve: "straight" },
    colors: (colors = dataColors ? dataColors.split(",") : colors),
    fill: {
      opacity: 0.8,
      gradient: { enabled: !1 },
      pattern: {
        enabled: !0,
        style: ["verticalLines", "horizontalLines"],
        width: 5,
        depth: 6,
      },
    },
    markers: { size: 5, hover: { size: 9 } },
    title: { text: "Network Monitoring" },
    tooltip: { intersect: !0, shared: !1 },
    theme: { palette: "palette1" },
    xaxis: { type: "datetime" },
    yaxis: { title: { text: "Bytes Received" } },
  });
(chart = new ApexCharts(
  document.querySelector("#area-chart-nullvalues"),
  options
)).render();