Advertiser dash: Jobs feed heath

by Angelos Chaidas

HTML

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

CSS

#container {
    /* width: 438px; */
    height:170px;
    border:1px solid #CCC;
}

JavaScript

var labels = [
    "% of jobs with a description<br/>of 100 characters or more",
    "% of jobs with a <strong>location</strong>",
    "% of jobs with a <strong>salary</strong>"];
$(function () {
    $('#container').highcharts({
        chart: {
            type: 'bar',
            marginTop: 0,
            marginBottom: 0,
            marginRight: 0
        },
        legend: {
            enabled: false
        },
        title: {
            text: null
        },
        xAxis: {
            min: 0,
            max: 2,
            lineColor: '#999999',
            tickLength: 0,
            categories: labels,
            labels: {
                enabled: true,
                style: {
                    fontFamily: 'Arial',
                    fontSize: '14px',
                    whiteSpace: 'nowrap'
                }
            }
        },
        yAxis: {
            min: 0,
            max: 100,
            gridLineWidth: 0,
            title: {
                text: null
            },
            labels: {
                enabled: false
            }
        },
        plotOptions: {
            bar: {
                dataLabels: {
                    enabled: true,
                    align: 'right',
                    x: -10,
                    format: '{point.y}%',
                    style: {
                        fontFamily: 'Arial',
                        fontSize: '14px',
                        fontWeight: 'bold',
                        color: 'white'
                    }
                },
                groupPadding: 0

            }
        },
        credits: {
            enabled: false
        },
        series: [{
            data: [{
                name: '% of jobs with a description of 100 characters or more',
                color: '#0660c5',
                y: 100
            }, {
                name: '% of jobs with a location',
                color: '#2b78ce',
                y: 85
            }, {
               ...