Legend image label study

by kzoon

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 600px"></div>

CSS

.myImage {
    width: 20px;
    height: 15px;
}

JavaScript

$(function () {
    $('#container').highcharts({

        chart: {
            renderTo: 'container',
            type: 'column'
            //backgroundColor: 'wheat'
        },
        legend: {
            // layout: 'vertical',
            // align: 'right',
            // verticalAlign: 'middle',
            useHTML: true,
            labelFormatter: function () {
                var img = {

                    'Netherlands': '<img title="Netherlands" class="myImage"  src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/75/country-4x3/nl.png"/>',
                        'Germany': '<img class="myImage" src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/75/country-4x3/de.png"/>',
                        'France': '<img class="myImage"  src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/75/country-4x3/fr.png"/>',
                }[this.name];
                return  this.name + img;
            }
        },

        plotOptions: {
            series: {
                stacking: 'normal',
                dataLabels: {
                    enabled: true,
                    useHTML: true,
                    formatter: function () {
                        var img = {

                            'Netherlands': '<img class="myImage"  src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/75/country-4x3/nl.png"/>',
                                'Germany': '<img class="myImage" src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/75/country-4x3/de.png"/>',
                                'France': '<img class="myImage"  src="https://raw.githubusercontent.com/stevenrskelton/flag-icon/master/png/75/country-4x3/fr.png"/>',
                        }[this.series.name];
                        return  this.y;
                    }
                }
            }
        },

        xAxis: {
            categories: ['2012', '2013', '2014']
        },
       ...