Charts for EM Louisiana energy piece

author: Mike Zavarello

by Mike Zavarello

HTML

<!-- Atlanta Fed scripts -->
<script src="https://www.frbatlanta.org/~/media/javascript/system/UniversalGoogleAnalytics.js"></script>
<script src="https://www.frbatlanta.org/~/media/javascript/highcharts/highcharts-global-settings-min.js"></script>

<!-- standard Highcharts scripts -->
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div class="economyMattersChart" id="container_LouisianaEnergyChart1"></div>
<br />
<div class="economyMattersChart" id="container_LouisianaEnergyChart2"></div>
<br />
<div class="economyMattersChart" id="container_LouisianaEnergyChart3"></div>
<br />
<div class="economyMattersChart" id="container_LouisianaEnergyChart4"></div>

CSS

.economyMattersChart { height: 400px; width: 100%; margin: 0 auto; }

JavaScript

$(document).ready(function(){

    var iframeWidth_economyMattersChart = $('.economyMattersChart').width();
    var iframeHeight_economyMattersChart = $('.economyMattersChart').height();

	/* chart 1: energy important but less so in louisiana economy */
	var sourceLine_LouisianaEnergyChart1 = 'Source: U.S. Bureau of Economic Analysis';
	setChartDefaults(iframeWidth_economyMattersChart,iframeHeight_economyMattersChart,sourceLine_LouisianaEnergyChart1,50);
	var chartOptions_LouisianaEnergyChart1 = {
		chart: { marginBottom: 110, marginRight: 20, renderTo: 'container_LouisianaEnergyChart1', type: 'line' },
		exporting: {
			chartOptions: {
				legend: { enabled: true }
			},
			filename: 'atlanta-fed_energy-important-but-less-so-in-louisiana-economy'
		},
		legend: { enabled: false },
		subtitle: { text: 'Share of state GDP from oil and gas extraction, mining support activities, petroleum and coal products manufacturing, and pipeline transportation', width: iframeWidth_economyMattersChart * 0.8 },
		title: { text: 'Energy Important but Less So in Louisiana Economy', width: iframeWidth_economyMattersChart * 0.8 },
		tooltip: {
			formatter: function () {
				var s = '<span style="font-size: 14px;">' + Highcharts.dateFormat('%Y', this.x) + '</span>';
				$.each(this.points, function (i, point) {
					s += '<br /><span style="color: ' + point.series.color + '; font-weight: bold;">' + point.series.name + '</span>: ' + Highcharts.numberFormat(point.y, 0) + '%';
				});
				return s;
			},
			shared: true
		},
		xAxis: {
			type: 'category', categories: ['1970','1971','1972','1973','1974','1975','1976','1977','1978','1979','1980','1981','1982','1983','1984','1985','1986','1987','1988','1989','1990','1991','1992','1993','1994','1995','1996','1997','1998','1999','2000','2001','2002','2003','2004','2005','2006','2007','2008','2009','2010','2011','2012','2013','2014','2015','2016','2017'], labels: { y: 20 }
		},
		yAxis: { 
			title: { text: 'Percent' }, min: 0, tickInterval:...