highcharts data labels demo for support forum question number 1

by franzo

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="height: 400px; min-width: 310px; max-width: 600px; margin: 0 auto"></div>

JavaScript

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

	   chart: {            
            defaultSeriesType:'scatter',
            borderWidth:1,
            borderColor:'#ccc',
            marginTop:30,
            plotBackgroundColor:'#fff',
            zoomType:'xy'
        },
        title:{
                text: 'Simulated bubble charts using scatter type. Good label positioning.'
            },
        legend:{
                enabled: false           
        },
        plotOptions: {
            series: {
                shadow:false
            },
            scatter: {
                cursor: 'pointer',
                dataLabels: {
                    crop: false,
                    enabled: true,                  
                    color: '#444',
                    align: 'left',
                    formatter: function() {
                        return this.point.name;
                    }
                },
                states:{
                   hover:{ enabled: false }
                }
            }            
        },
        
        navigation: {
            buttonOptions: {
                enabled: false
            }
        },
        xAxis:{
            min:0,
            max:null,
            minPadding: 0.099,
            maxPadding: 0.099,
            startOnTick: false,
            endOnTick: false,
            lineColor:'#999',
            lineWidth:1,
            tickColor:'#666',
            tickLength:3,
            title:{
                style: {
                    fontSize: '15px'
                },
                text:'Beauty'
            }
        },
        yAxis:{
            min:0,
            max:104,
            minPadding: 0.099,
            maxPadding: 0.099,
            startOnTick: false,
            endOnTick: false,
            lineColor:'#999',
            lineWidth:1,
            tickColor:'#666',
            tickLength:3,
            tickWidth:1,
            gridLineColor:'#ddd',
            title:{
  ...