Treemap: Level specific settings

by Torstein Hønsi

HTML

<script src="https://code.highcharts.com/highcharts.src.js"></script>
<!-- Latest stable commit -->
<script src="https://code.highcharts.com/modules/heatmap.src.js"></script>
<script src="https://code.highcharts.com/modules/treemap.src.js"></script>
<div id="container"></div>

CSS

#container {
    width: 600px;
    height: 400px;
    margin: 1em auto;
}

JavaScript

$('#container').highcharts({
    series: [{
        levels: [{
            level: 1,
            layoutAlgorithm: 'stripes',
            borderRadius: 50,
            borderColor: 'black',
            borderWidth: 4
        }],
        dataLabels: {
            enabled: true,
            style: {
                color: 'black',
                fontWeight: 'bold',
                HcTextStroke: '3px rgba(255,255,255,0.5)'
            }
        },
        type: "treemap",
        data: [{
            id: 'Apples',
            color: "#EC2500"
        }, {
            id: 'Bananas',
            color: "#ECE100"
        }, {
            id: 'Oranges',
            color: '#EC9800'
        }, {
            id: 'Anne',
            parent: 'Apples',
            value: 5
        }, {
            id: 'Rick',
            parent: 'Apples',
            value: 3
        }, {
            id: 'Peter',
            parent: 'Apples',
            value: 4
        }, {
            id: 'Anne',
            parent: 'Bananas',
            value: 4
        }, {
            id: 'Rick',
            parent: 'Bananas',
            value: 10
        }, {
            id: 'Peter',
            parent: 'Bananas',
            value: 1
        }, {
            id: 'Anne',
            parent: 'Oranges',
            value: 1
        }, {
            id: 'Rick',
            parent: 'Oranges',
            value: 3
        }, {
            id: 'Peter',
            parent: 'Oranges',
            value: 3
        }, {
            id: 'Susanne',
            parent: 'Kiwi',
            value: 2,
            color: '#9EDE00'
        }]
    }],
    title: {
        text: 'Fruit consumption'
    }
});