Demo - Data Labels

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css">
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.input.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.chart.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.chart.analytics.min.js"></script>
<div class="container">
    <div id="chart1"></div>
</div>

CSS

body {
    margin: 40px;
}

.wj-flexchart {
    width: 100%;
}

JavaScript

onload = function() {
    var max = [];
    var min = [];

    var chart1 = new wijmo.chart.FlexChart('#chart1', {
        itemsSource: getData(1),
        bindingX: 'date',
        /* chartType: 'Column',
        series: [{
            binding: 'downloads',
            name: 'Downloads'
        }], */
        dataLabel: {
            content: '{value:n0}',
            rendering: renderLabel
        },
        rendered: function(s, e) {
            //chart1.axisY.min = -chart1.axisY.actualMax;
        }
    });

    let sales = new wijmo.chart.analytics.Waterfall({
        name: 'Increase,Decrease,Total',
        binding: 'sales',
        styles: {
            start: {
                fill: 'blue',
                stroke: 'blue'
            },
            total: {
                fill: 'yellow',
                stroke: 'yellow'
            },
            falling: {
                fill: 'red',
                stroke: 'red'
            },
            rising: {
                fill: 'green',
                stroke: 'green'
            },
            connectorLines: {
                stroke: 'blue',
                'stroke-dasharray': '3, 1'
            }
        }
    });
    chart1.series.push(sales);

    function renderLabel(sender, e) {
        var hitTestInfo = e.hitTestInfo;
        var chart = hitTestInfo.chart;
        var items = hitTestInfo.series.collectionView.items;
        var val = items[hitTestInfo.pointIndex].sales;

        // custome rendering for negative values only
        if (val < 0) {
            var valStr = wijmo.Globalize.format(val, 'n0');
            var pt = chart.dataToPoint(hitTestInfo.pointIndex, hitTestInfo.y);
            pt.y += 20;
            var size = e.engine.measureString(valStr);
            pt.x -= size.width / 2;
            e.engine.drawString(valStr, pt, 'wj-data-label');
            e.text = '';
        }
    }

    // create some random data
    function getData(factor) {
        let data = [],
            date =...