如何更改柱形图的水平轴颜色?

时间:2014-07-24 02:07:37

标签: javascript charts google-visualization

我有一个Google Column Chart,我想更改其横轴的颜色。

enter image description here

http://jsfiddle.net/chM9A/

function drawGenderColumnChart() {
    var data = google.visualization.arrayToDataTable([
        ['Age', 'Female', 'Male'],
        ['13-17', 500, 600],
        ['18-24', 700, 800],
        ['25-34', 960, 950],
        ['35-44', 1030, 1100],
        ['44-54', 1030, 900],
        ['55-64', 950, 800],
        ['65+', 700, 500], ]);

    var options = {
        colors: ['#ADD6EA', '#DFB9D1'],
        legend: {
            position: 'none'
        },
        bar: {
            groupWidth: "94%"
        },
        axisFontSize: 0,
        vAxis: {
            textPosition: 'none',
            gridlines: {
                color: 'transparent'
            }
        },
    };

    var chart = new google.visualization.ColumnChart(document.getElementById('age_chart'));
    chart.draw(data, options);
}

我一直在剖析文档,看起来API不会让我们这样做。你有什么想法吗?

1 个答案:

答案 0 :(得分:4)

使用baselineColor

vAxis: {
            baselineColor:'Red',
            textPosition: 'none',
            gridlines: {
                color: 'transparent'
            }
        }

http://jsfiddle.net/B4AfE/1/