Highcharts Demo

author(s): Torstein Hønsi

HTML

<script src="http://code.highcharts.com/maps/highmaps.js"></script>
<script src="http://code.highcharts.com/maps/modules/data.js"></script>
<script src="http://code.highcharts.com/maps/modules/exporting.js"></script>


<div id="container"></div>

CSS

#container {
	height: 500px; 
	min-width: 310px; 
	max-width: 800px; 
	margin: 0 auto; 
}
.loading {
	margin-top: 10em;
	text-align: center;
	color: gray;
}

JavaScript

var chart1 =null;
                            $(function () {
                             


                                Highcharts.setOptions({
                                    lang: {
                                        decimalPoint: ','
                                    }
                                });
                                chart1 = new Highcharts.Chart({
                                  
                                    chart: {
                                        backgroundColor: 'transparent',
                                        plotBackgroundColor: null,
                                        plotBorderWidth: 0,
                                        plotShadow: false,
                                        renderTo: 'container'
                                    },
                                    title: {
                                        //text: 'Répartition géographique'
                                        text: false
                                    },
                                    tooltip: {
                                        headerFormat: '',
                                        pointFormat: '<b>{point.percentage:.1f}%</b>'
                                    },
                                    plotOptions: {
                                        pie: {
                                            startAngle: 0,
                                            endAngle: 360,
                                            center: ['50%', '50%'],
                                            y: 0,
                                            dataLabels: {
                                                enabled: false
                                            },
                                            showInLegend: true
                                        }
                                    },
                                    legend: {
                                   ...