Charts for Brazilian trade EM article

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_ExportsToBrazil"></div>
<div class="economyMattersChart" id="container_ImportsFromBrazil"></div>

CSS

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

JavaScript

$(document).ready(function(){ 

	var iframeWidth_BrazilCharts = $('.economyMattersChart').width();
	var iframeHeight_BrazilCharts = $('.economyMattersChart').height();

	var sourceLine_ExportsToBrazil = 'Source: U.S. Census Bureau';
	setChartDefaults(iframeWidth_BrazilCharts,iframeHeight_BrazilCharts,sourceLine_ExportsToBrazil,50);
	var chartOptions_ExportsToBrazil = {
	  chart: { marginBottom: 100, marginRight: 20, renderTo: 'container_ExportsToBrazil', type: 'column' },
	  exporting: {
		chartOptions: {
		  legend: { enabled: true }
		},
		filename: 'atlanta-fed_economy-matters_exports-to-brazil'
	  },
		legend: { floating: false, x: -15, itemWidth: iframeWidth_BrazilCharts * 0.2, width: iframeWidth_BrazilCharts * 0.62 },
	  subtitle: { text: '' },
	  title: { text: 'Exports to Brazil', width: iframeWidth_BrazilCharts * 0.8 },
	  tooltip: {
		formatter: function () {
		  var s = '<span style="font-size: 14px;">' + this.x + ' exports to Brazil</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) + 'M';
		  });
		  return s;
		},
		shared: true
	  },
	  xAxis: {
		  categories: ['Alabama','Florida','Georgia','Louisiana','Mississippi','Tennessee'], 
		  labels: { y: 20 }
	  },
	  yAxis: { 
		plotLines:[{ value: 0, color: '#666', width: 2, zIndex: 3 }],
		title: { text: 'Millions of dollars' }, tickInterval: 500
	  },
	  series: [
		{ name: '2015', data: [334,3700,1220,1460,183,732] },
		{ name: '2016', data: [243,3590,915,1740,194,502] },
		{ name: '2017', data: [444,4090,859,2770,304,520] }
	  ]
	};
	var chart_ExportsToBrazil = new Highcharts.Chart(chartOptions_ExportsToBrazil);
	setChartBranding(chart_ExportsToBrazil,iframeWidth_BrazilCharts,iframeHeight_BrazilCharts,sourceLine_ExportsToBrazil,50);

	var sourceLine_ImportsFromBrazil = 'Source: U.S. Census...