document.addEventListener("DOMContentLoaded", function() {
	var options = {
		chart: {
			height: 350,
			type: "heatmap",
			zoom: {
				enabled: false
			},
			toolbar: {
				show: false
			},
			events: {
			  mounted: function(chartContext, config) {
				setTimeout(() => {  document.getElementsByClassName("apexcharts-subtitle-text")[0].addEventListener('click', clickDiv); }, 1000);
			  }
			}
					},
		title: {
			text: "heatmap",
			align: 'left',
			margin: 0,
			offsetX: 0,
			offsetY: 0,
			floating: false,
			style: {
			  fontSize:  '14px',
			  fontWeight:  'bold',
			  fontFamily:  undefined,
			  color:  '#263238'
			}
		},
		subtitle: {
			  text: '© govstats.us',
			  align: 'right',
			  margin: 0,
			  offsetX: 0,
			  offsetY: 45, // 295
			  floating: true,
			  style: {
				fontSize:  '11px',
				fontWeight:  'normal',
				fontFamily:  undefined,
				color:  '#AAA',
				background: '#FFF'
			  },
		  },
		series: [
	  {
	  name: 'Sunday',
	  data: [{
		  x: '2022-02-20',
		  y: 40
		  }]
	  },
	  {
	  name: 'Monday',
	  data: [{
		  x: '2022-02-21',
		  y: 0
		  }]
	  },
	  {
	  name: 'Tuesday',
	  data: [{
		  x: '2022-02-22',
		  y: 5
		  }]
	  },
	  {
	  name: 'Wednesday',
	  data: [{
		  x: '2022-02-23',
		  y: 100
		  }]
	  },
	  {
		name: 'Thursday',
		data: [{
		  x: '2022-02-24',
		  y: 17
		}]
	  },
	  {
		name: 'Friday',
		data: [{
		  x: '2022-02-25',
		  y: 4
		}]
	  },
	  {
		name: 'Saturday',
		data: [{
		  x: '2022-02-26',
		  y: 90
		}]
	  },
  ]
			}
	var chart = new ApexCharts(
		document.querySelector("#chart"),
		options
	);
	chart.render();
	function clickDiv() { console.log("https://govstats.us/metric/heatmap"); }
	});