1

Highcharts を使用していますが、何かを達成できません。ここに私が欲しいものがあります:

ここに画像の説明を入力

ご覧のとおり、各バーのテキストはバーの上にあります。

これが私が取り組んできたバージョンです：

$(function () {
        $('#container').highcharts({
            chart: {
                type: 'bar'
            },
            title: {
                text: 'APPROVED SPEND TO DATE FOR FISCAL YEAR 2013: $17,360,612'
            },
            xAxis: {
                categories: ['Intellectual Property', 'Antitrust/Competition'],
                title: {
                    text: null
                }
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Approved spend',
                    align: 'high'
                },
                labels: {
                    overflow: 'justify'
                }
            },
            tooltip: {
                valueSuffix: ' dollars'
            },
            plotOptions: {
                bar: {
                    dataLabels: {
                        enabled: false
                    }
                }
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -40,
                y: 100,
                floating: true,
                borderWidth: 1,
                backgroundColor: '#FFFFFF',
                shadow: true
            },
            credits: {
                enabled: false
            },
            series: [{
                name: 'Year 2013',
                data: [6000123, 3743653]
            }]
        });
    });

JSFiddle : http://jsfiddle.net/WcKvz/1/

ご覧のとおり、テキストはバーの左側にしか表示されず、正しく表示されません。

何か案は？ありがとうございました

4

1 に答える 1

2

私がこれを確認した唯一の方法は、stackedLabels を使用することです。系列が 1 つしかないため、積み上げ棒グラフを使用していなくても使用できます。

        ...
        plotOptions: {
            bar: {
                stacking: 'normal'
            }
        },
        yAxis: {
            stackLabels: {
                formatter: function() {
                    return this.axis.chart.xAxis[0].categories[this.x] + ': $' + this.total;
                },
                enabled: true,           
                verticalAlign: 'top',     
                align: 'left',
                y: -5
            }, 
         ...

http://jsfiddle.net/NVypa/

于 2013-09-12T19:10:05.693 に答える