JavaScript ChartsDownload

import {
  AgAreaSeriesOptions,
  AgChartOptions,
  AgCharts,
  AreaSeriesModule,
  CategoryAxisModule,
  LegendModule,
  ModuleRegistry,
  NumberAxisModule,
} from "ag-charts-community";
import { getData } from "./data";

function buildSeries(name: string): AgAreaSeriesOptions {
  return {
    type: "area",
    xKey: "year",
    yKey: name.toLowerCase(),
    yName: name,
    fillOpacity: 0.5,
  };
}
ModuleRegistry.registerModules([
  AreaSeriesModule,
  CategoryAxisModule,
  LegendModule,
  NumberAxisModule,
]);

const options: AgChartOptions = {
  title: {
    text: "Browser Usage Statistics",
  },
  subtitle: {
    text: "2009-2019",
  },
  data: getData(),
  series: [
    buildSeries("IE"),
    buildSeries("Chrome"),
    buildSeries("Firefox"),
    buildSeries("Safari"),
  ],
  legend: { position: "top" },
};

options.container = document.getElementById("myChart");

const chart = AgCharts.create(options);

function download() {
  chart.download();
}

function downloadFixedSize() {
  chart.download({ width: 600, height: 300 });
}

function openImage() {
  chart.getImageDataURL({ width: 600, height: 300 }).then((imageDataURL) => {
    const image = new Image();
    image.src = imageDataURL;
    const tab = window.open(imageDataURL);
    if (tab) {
      tab.document.write(image.outerHTML);
      tab.document.close();
    }
  });
}

if (typeof window !== "undefined") {
  // Attach external event handlers to window so they can be called from index.html
  (<any>window).download = download;
  (<any>window).downloadFixedSize = downloadFixedSize;
  (<any>window).openImage = openImage;
}

export function getData(): any[] {
  return [
    {
      year: "2009",
      ie: 64.97,
      firefox: 26.85,
      safari: 2.79,
      chrome: 1.37,
    },
    {
      year: "2010",
      ie: 54.39,
      firefox: 31.15,
      safari: 4.22,
      chrome: 5.94,
    },
    {
      year: "2011",
      ie: 44.03,
      firefox: 29.36,
      safari: 5.94,
      chrome: 15.01,
    },
    {
      year: "2012",
      ie: 34.27,
      firefox: 22.69,
      safari: 8.09,
      chrome: 25.99,
    },
    {
      year: "2013",
      ie: 26.55,
      firefox: 18.55,
      safari: 10.66,
      chrome: 31.71,
    },
    {
      year: "2014",
      ie: 17.75,
      firefox: 14.77,
      safari: 12.63,
      chrome: 35.85,
    },
    {
      year: "2015",
      ie: 13.3,
      firefox: 11.82,
      safari: 13.79,
      chrome: 42.27,
    },
    {
      year: "2016",
      ie: 8.94,
      firefox: 8.97,
      safari: 12.9,
      chrome: 47.79,
    },
    {
      year: "2017",
      ie: 4.77,
      firefox: 6.75,
      safari: 14.54,
      chrome: 51.76,
    },
    {
      year: "2018",
      ie: 3.2,
      firefox: 5.66,
      safari: 14.44,
      chrome: 56.31,
    },
    {
      year: "2019",
      ie: 2.7,
      firefox: 4.66,
      safari: 15.23,
      chrome: 61.72,
    },
  ];
}