如何删除y轴线并格式化谷歌列图表中的y轴值

时间:2013-11-15 13:36:59

标签: javascript charts formatting google-visualization

我在我的图表中的应用程序中使用谷歌柱形图我需要删除我的蓝色和灰色条之间的微小空间,并格式化y轴值。请建议我,如何消除它们之间的微小差距。我的图表enter image description here

图表代码

google.load("visualization", "1", {packages: ["columnchart"]});                
var datum=[];
                        datum=[[2,15,25]];
var data = google.visualization.arrayToDataTable([['column1', 'column2', 'column3']].concat(datum), false);
                            var options = {
                            legend: {position: 'none'},
                            colors: ['3399FF', 'C0C0C0'],
                            tooltip: {trigger: 'none'},
//                            vAxis: {minValue: 0, maxValue: maxValue, ticks: tick, format: '$'}
                            };
                                    var chart = new google.visualization.ColumnChart(document.getElementById('chart'));
                            chart.draw(data, options);

更新

如何删除y轴线并需要格式化y轴值,如$ 10,$ 15,$ 30。在柱形图包中有没有办法做到这一点。我提到图表的链接是this

2 个答案:

答案 0 :(得分:1)

您可以将以下内容添加到options对象:bar: {groupWidth: '100%'}

这将消除灰色和蓝色条之间的差距。

所有选项也列在documentation

答案 1 :(得分:0)

首先,不要使用旧版本的ColumnChart;它已被弃用,并不提供新版本不具备的任何功能。像这样加载它:

google.load('visualization', '1', {packages: ['corechart']});

要格式化轴值,需要使用vAxis.format选项:

var options = {
    legend: {position: 'none'},
    colors: ['3399FF', 'C0C0C0'],
    tooltip: {trigger: 'none'},
    vAxis: {
        format: '$#'
    }
};