Highcharts Demo

author(s): Torstein Hønsi

by ninachroscicka

HTML

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

<div id="container" style="height: 400px; width: 500px"></div>

CSS

@import url(https://fonts.googleapis.com/css?family=Raleway:400);

JavaScript

$(function() {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'pie'
        },
        plotOptions: {
	        pie: {
	            innerSize: '95%',
              dataLabels: {
                  enabled: true,
                  format: '{point.percentage:.1f} %',
                  connectorColor: 'transparent',
                  style: {
          				fontSize:'14px',
            			fontFamily : 'Helvetica',
                  fontWeight:200
          			}
              }
	        }
	    },
        
        title: {
            text:'',
            verticalAlign: 'middle',
            floating: true
        },
	    
	    series: [{
	        data: [
        {
            name: 'Negatywny',
            y: 28,
            color: '#c74a31'
        }, {
            name: 'Neutralny',
            y: 34,
            color: '#c3c3c3'
        }, {
            name: 'Pozytywny',
            y: 38,
            color: '#3c9173'
        }],
            borderWidth: 12,
            borderColor: null
	    }]
    },
    // using 
                                     
    function(chart) { // on complete
        
    // Render the image 
   chart.renderer.image('https://banner2.kisspng.com/20180520/bjp/kisspng-facebook-inc-logo-facebook-messenger-5b015e158fb1f8.1544119415268162775886.jpg', 220, 170, 60, 60)
            .add();
    });
});