wc 2014 goal comparison

by Nivaldo

HTML

<h3>Score Moments in WC2014</h3>
<h5>score moments in <a href="http://www.economist.com/node/21603828?fsrc=scn/tw_ec/goooooaaaaaaaallllll_">all cups</a></h5>
<script src="http://code.highcharts.com/highcharts.js"></script>
<!--<script src="http://code.highcharts.com/modules/exporting.js"></script>-->

<div id="Argentina"></div>
<div id="Brazil"></div>
<div id="Germany"></div>
<div id="Netherlands"></div>

CSS

div {
    width: 200px;
    height: 400px;
    margin-top: 5px;
    margin-left: 20px;
    float: left;
}

JavaScript

drawChart("Brazil",
          "#Brazil",
          [0, 0, -1, 0, 0, -1, -1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
          [0, 0, 0, 2, 0, 1, 1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1, 0, 1, 0]);

drawChart("Netherlands",
          "#Netherlands",
          [0, 0, 0, 0, -1, -1, 0, 0, 0, 0, -1, -1, 0, 0, 0, 0, 0, 0, 0, 0, 0],
          [0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 1, 1, 1, 1, 1, 2, 0, 1, 2, 0]);

drawChart("Germany",
          "#Germany",
          [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, -1, 0, -1, 0, 0, 0, 0, 0, 0, -1],
          [0, 0, 1, 0, 0, 0, 1, 0, 0, 1, 0, 2, 0, 0, 0, 1, 1, 0, 0, 0, 2]);

drawChart("Argentina",
          "#Argentina",
          [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, -1, 0, 0, 0, 0, 0, 0, -1, 0, 0, 0],
          [3, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 0, 0, 1, 0, 0, 0, 0, 0, 1, 1]);


function drawChart(country,
                   container,
                   con,
                   pro) {
    var chart,
        categories = ['0-5', '6-10', '11-15', '16-20',
            '21-25', '26-30', '31-35', '36-40', '41-45',
            '45+', '46-50', '51-55', '56-60', '61-65',
            '66-70', '71-75', '76-80', '81-85', '86-90',
            '90+', 'Extra'];
    $(document).ready(function() {
        $(container).highcharts({
            chart: {
                type: 'bar',
                backgroundColor: 'lightsteelblue'
            },
            credits: {
                enabled: false
            },
            title: {
                text: country
            },
            subtitle: {
                text: 'source: www.fifa.com'
            },
            xAxis: [{
                categories: categories,
                alternateGridColor: 'antiquewhite',
                reversed: false,
                labels: {
                    step: 1,
                    style: { 
                        font: 'normal 10px sans-serif'
                    }
                },
                plotBands: [
                    {
                    color:...